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>
This commit is contained in:
@@ -0,0 +1,98 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import '../../../core/availability/mitra_availability_notifier.dart';
|
||||
import '../../../core/constants.dart';
|
||||
import '../../../core/pairing/pairing_notifier.dart';
|
||||
|
||||
/// Shown when a "Curhat lagi" attempt against a specific bestie can't proceed
|
||||
/// — either a 409 `targeted_mitra_offline` response on the targeted POST, or
|
||||
/// one of the intermediate WS events (`returning_chat_timeout`,
|
||||
/// `returning_chat_rejected`).
|
||||
///
|
||||
/// CTAs:
|
||||
/// - "Chat dengan bestie lain" — only rendered when
|
||||
/// [mitraAvailabilityProvider] reports `available == true` at the time of
|
||||
/// build. Tapping calls [Pairing.fallbackToBlast] (reuses the same payment
|
||||
/// session — no double-charge) and closes the dialog. The caller is expected
|
||||
/// to be the searching screen, which will transition into PairingSearchingData
|
||||
/// and stay put.
|
||||
/// - "Kembali" — pops dialog and routes home. Backend has already audit-logged
|
||||
/// the targeted failure; payment session stays `confirmed` until the sweeper
|
||||
/// expires it.
|
||||
class BestieUnavailableDialog extends ConsumerWidget {
|
||||
final String paymentSessionId;
|
||||
final String mitraName;
|
||||
final TopicSensitivity topicSensitivity;
|
||||
|
||||
const BestieUnavailableDialog({
|
||||
super.key,
|
||||
required this.paymentSessionId,
|
||||
required this.mitraName,
|
||||
required this.topicSensitivity,
|
||||
});
|
||||
|
||||
/// Convenience: show this dialog and return when it closes. Per project
|
||||
/// memory ("Riverpod ref.listen in build is unsafe"), callers should
|
||||
/// invoke this from `ref.listenManual` callbacks in `initState`, not from
|
||||
/// `build`.
|
||||
static Future<void> show(
|
||||
BuildContext context, {
|
||||
required String paymentSessionId,
|
||||
required String mitraName,
|
||||
required TopicSensitivity topicSensitivity,
|
||||
}) {
|
||||
return showDialog<void>(
|
||||
context: context,
|
||||
barrierDismissible: false,
|
||||
builder: (_) => BestieUnavailableDialog(
|
||||
paymentSessionId: paymentSessionId,
|
||||
mitraName: mitraName,
|
||||
topicSensitivity: topicSensitivity,
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
// Snapshot at dialog-open time — we don't keep listening, we just check
|
||||
// whether other bestie are around right now.
|
||||
final availabilityAsync = ref.watch(mitraAvailabilityProvider);
|
||||
final hasOtherAvailable = availabilityAsync.valueOrNull ?? false;
|
||||
|
||||
return AlertDialog(
|
||||
title: const Text('Bestie sedang tidak online'),
|
||||
content: Text(
|
||||
'$mitraName sedang tidak bisa menerima chat saat ini. '
|
||||
'Kamu bisa coba chat dengan bestie lain atau kembali ke beranda.',
|
||||
),
|
||||
actions: [
|
||||
TextButton(
|
||||
onPressed: () {
|
||||
// Reset pairing state and route home. Payment session stays
|
||||
// confirmed until sweeper expires it — no extra API call needed.
|
||||
ref.read(pairingProvider.notifier).reset();
|
||||
Navigator.of(context).pop();
|
||||
context.go('/home');
|
||||
},
|
||||
child: const Text('Kembali'),
|
||||
),
|
||||
if (hasOtherAvailable)
|
||||
ElevatedButton(
|
||||
onPressed: () {
|
||||
// Close the dialog first, then kick off the fallback. The
|
||||
// searching screen will pick up the new PairingSearchingData
|
||||
// state and render normally (no targeted overlay).
|
||||
Navigator.of(context).pop();
|
||||
// ignore: discarded_futures
|
||||
ref.read(pairingProvider.notifier).fallbackToBlast(
|
||||
paymentSessionId: paymentSessionId,
|
||||
topicSensitivity: topicSensitivity,
|
||||
);
|
||||
},
|
||||
child: const Text('Chat dengan bestie lain'),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -3,27 +3,21 @@ import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import '../../../core/chat/chat_opening_provider.dart';
|
||||
import '../../../core/chat/session_closure_notifier.dart';
|
||||
import '../../../core/constants.dart';
|
||||
import '../../../core/pairing/pairing_notifier.dart';
|
||||
|
||||
/// Extension-only pricing sheet.
|
||||
///
|
||||
/// Used solely for in-session extension requests; the initial pairing flow
|
||||
/// goes through `/payment` instead. Free-trial is never offered for extensions.
|
||||
///
|
||||
/// Submit triggers [SessionClosure.requestExtension], which internally
|
||||
/// runs the payment-session create+confirm and then the extend POST.
|
||||
class PricingBottomSheet extends ConsumerWidget {
|
||||
/// If set, the bottom sheet is in "extension" mode — selecting a tier extends the session.
|
||||
final String? extensionSessionId;
|
||||
/// Required — the in-progress chat session id this extension targets.
|
||||
final String extensionSessionId;
|
||||
|
||||
/// Required when starting a new pairing. Null when in extension mode.
|
||||
final TopicSensitivity? topicSensitivity;
|
||||
const PricingBottomSheet({super.key, required this.extensionSessionId});
|
||||
|
||||
const PricingBottomSheet({super.key, this.extensionSessionId, this.topicSensitivity});
|
||||
|
||||
/// Show for new pairing (from home screen)
|
||||
static Future<void> show(BuildContext context, {required TopicSensitivity topicSensitivity}) {
|
||||
return showModalBottomSheet(
|
||||
context: context,
|
||||
isScrollControlled: true,
|
||||
builder: (_) => PricingBottomSheet(topicSensitivity: topicSensitivity),
|
||||
);
|
||||
}
|
||||
|
||||
/// Show for session extension (from chat screen)
|
||||
/// Show for session extension (from chat screen).
|
||||
static Future<void> showForExtension(BuildContext context, {required String sessionId}) {
|
||||
return showModalBottomSheet(
|
||||
context: context,
|
||||
@@ -32,19 +26,8 @@ class PricingBottomSheet extends ConsumerWidget {
|
||||
);
|
||||
}
|
||||
|
||||
String _formatPrice(int price) {
|
||||
final str = price.toString();
|
||||
final buffer = StringBuffer();
|
||||
for (var i = 0; i < str.length; i++) {
|
||||
if (i > 0 && (str.length - i) % 3 == 0) buffer.write('.');
|
||||
buffer.write(str[i]);
|
||||
}
|
||||
return 'Rp $buffer';
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final isExtension = extensionSessionId != null;
|
||||
final pricingAsync = ref.watch(chatPricingProvider);
|
||||
|
||||
return pricingAsync.when(
|
||||
@@ -52,7 +35,7 @@ class PricingBottomSheet extends ConsumerWidget {
|
||||
height: 200,
|
||||
child: Center(child: CircularProgressIndicator()),
|
||||
),
|
||||
error: (error, _) => SizedBox(
|
||||
error: (error, _) => const SizedBox(
|
||||
height: 200,
|
||||
child: Center(child: Text('Gagal memuat harga. Coba lagi.')),
|
||||
),
|
||||
@@ -67,54 +50,30 @@ class PricingBottomSheet extends ConsumerWidget {
|
||||
child: ListView(
|
||||
controller: scrollController,
|
||||
children: [
|
||||
Text(
|
||||
isExtension ? 'Perpanjang Durasi' : 'Pilih Durasi Curhat',
|
||||
style: const TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
|
||||
const Text(
|
||||
'Perpanjang Durasi',
|
||||
style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
if (!isExtension && pricing.freeTrialEligible) ...[
|
||||
Card(
|
||||
color: Colors.green.shade50,
|
||||
child: ListTile(
|
||||
leading: const Icon(Icons.card_giftcard, color: Colors.green),
|
||||
title: Text('Free Trial (${pricing.freeTrialDurationMinutes} Menit)'),
|
||||
subtitle: const Text('Gratis untuk pertama kali!'),
|
||||
trailing: const Icon(Icons.arrow_forward_ios, size: 16),
|
||||
onTap: () {
|
||||
Navigator.of(context).pop();
|
||||
_startPairing(ref, isFreeTrial: true);
|
||||
},
|
||||
),
|
||||
),
|
||||
const Divider(height: 24),
|
||||
],
|
||||
// No free-trial path for extensions.
|
||||
...pricing.tiers.map((tier) => Card(
|
||||
child: ListTile(
|
||||
title: Text(tier.label),
|
||||
trailing: Text(
|
||||
_formatPrice(tier.price),
|
||||
style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
|
||||
),
|
||||
onTap: () {
|
||||
Navigator.of(context).pop();
|
||||
if (isExtension) {
|
||||
_requestExtension(
|
||||
ref,
|
||||
sessionId: extensionSessionId!,
|
||||
durationMinutes: tier.durationMinutes,
|
||||
price: tier.price,
|
||||
);
|
||||
} else {
|
||||
_startPairing(
|
||||
ref,
|
||||
durationMinutes: tier.durationMinutes,
|
||||
price: tier.price,
|
||||
);
|
||||
}
|
||||
},
|
||||
),
|
||||
)),
|
||||
child: ListTile(
|
||||
title: Text(tier.label),
|
||||
trailing: Text(
|
||||
formatRupiah(tier.price),
|
||||
style: const TextStyle(fontWeight: FontWeight.bold, fontSize: 16),
|
||||
),
|
||||
onTap: () {
|
||||
Navigator.of(context).pop();
|
||||
ref.read(sessionClosureProvider.notifier).requestExtension(
|
||||
extensionSessionId,
|
||||
durationMinutes: tier.durationMinutes,
|
||||
price: tier.price,
|
||||
);
|
||||
},
|
||||
),
|
||||
)),
|
||||
],
|
||||
),
|
||||
);
|
||||
@@ -122,21 +81,4 @@ class PricingBottomSheet extends ConsumerWidget {
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
void _startPairing(WidgetRef ref, {bool isFreeTrial = false, int? durationMinutes, int? price}) {
|
||||
ref.read(pairingProvider.notifier).requestPairingWithTier(
|
||||
durationMinutes: durationMinutes,
|
||||
price: price,
|
||||
isFreeTrial: isFreeTrial,
|
||||
topicSensitivity: topicSensitivity ?? TopicSensitivity.regular,
|
||||
);
|
||||
}
|
||||
|
||||
void _requestExtension(WidgetRef ref, {required String sessionId, required int durationMinutes, required int price}) {
|
||||
ref.read(sessionClosureProvider.notifier).requestExtension(
|
||||
sessionId,
|
||||
durationMinutes: durationMinutes,
|
||||
price: price,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,70 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import '../../../core/pairing/pairing_notifier.dart';
|
||||
|
||||
/// Full-screen modal overlay shown above the searching screen during the 20s
|
||||
/// targeted-mitra wait window. The overlay reads its state directly from the
|
||||
/// [PairingTargetedWaitingData] passed in by the parent — the local countdown
|
||||
/// ticks are owned by the pairing notifier so the overlay just renders.
|
||||
///
|
||||
/// "Batalkan" calls `pairingNotifier.cancelSearch()` which posts to
|
||||
/// `/api/client/chat/chat-requests/cancel` and transitions state to
|
||||
/// `PairingCancelledData`. The parent screen listens for that and pops home.
|
||||
class TargetedWaitingOverlay extends ConsumerWidget {
|
||||
final PairingTargetedWaitingData waiting;
|
||||
|
||||
const TargetedWaitingOverlay({super.key, required this.waiting});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
return Container(
|
||||
// Slight scrim so the underlying searching UI is still visible but the
|
||||
// overlay clearly owns the foreground.
|
||||
color: Colors.black.withValues(alpha: 0.55),
|
||||
child: Center(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 32),
|
||||
child: Card(
|
||||
elevation: 6,
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.fromLTRB(24, 24, 24, 16),
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
const SizedBox(
|
||||
width: 56,
|
||||
height: 56,
|
||||
child: CircularProgressIndicator(strokeWidth: 3),
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
Text(
|
||||
'Menunggu konfirmasi ${waiting.mitraName}',
|
||||
textAlign: TextAlign.center,
|
||||
style: const TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
'${waiting.secondsRemaining}d',
|
||||
style: const TextStyle(fontSize: 28, fontWeight: FontWeight.w300),
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
const Text(
|
||||
'Bestie punya 20 detik untuk merespon. Kalau tidak ada respon, kami bantu cari bestie lain.',
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(fontSize: 13, color: Colors.grey),
|
||||
),
|
||||
const SizedBox(height: 16),
|
||||
TextButton(
|
||||
onPressed: () => ref.read(pairingProvider.notifier).cancelSearch(),
|
||||
child: const Text('Batalkan'),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user