Files
halobestie-clone/client_app/lib/features/auth/screens/display_name_screen.dart
Ramadhan Sjamsani eeb4ea38fc feat(client/analytics): GA4 funnel instrumentation + unified home CTA
Add Firebase Analytics (GA4) funnel tracking to client_app:
- AnalyticsService typed wrapper (enum-gated, no PII) + analyticsProvider
- FirebaseAnalyticsObserver on GoRouter (screen_name via nameExtractor)
- user_id = customer UUID, user_type property, set on auth resolve/upgrade
- funnel events: curhat_start, curhat_repeat_start, auth_*, onboarding_usp_view,
  payment_view, payment_method_select, payment_started, pairing_matched/no_bestie
- bottom-sheet events: verif_choice_view/select, bestie_choice_view/select,
  extension_offer_view, chat_extension_requested
- payment_started carries app_instance_id + ga_session_id in the
  /payment-requests body for future server-side stitching (backend ignores)
- curhat_mode_pick screen name disambiguates the chat/call mode picker
  (/payment/method-pick) from the payment-channel picker (/payment/method)
- unify both home CTAs to "Aku Mau Curhat"

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-06-02 21:57:26 +08:00

160 lines
5.5 KiB
Dart

import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import '../../../core/analytics/analytics_service.dart';
import '../../../core/api/api_client_provider.dart';
import '../../../core/auth/auth_notifier.dart';
import '../../../core/theme/halo_tokens.dart';
import '../../../core/theme/widgets/widgets.dart';
import '../widgets/verif_choice_sheet.dart';
class DisplayNameScreen extends ConsumerStatefulWidget {
const DisplayNameScreen({super.key});
@override
ConsumerState<DisplayNameScreen> createState() => _DisplayNameScreenState();
}
class _DisplayNameScreenState extends ConsumerState<DisplayNameScreen> {
final _controller = TextEditingController();
ProviderSubscription<AsyncValue<AuthData>>? _authSub;
String? _errorMessage;
bool _routedAfterLogin = false;
@override
void initState() {
super.initState();
// Listener registered once in initState (see feedback_riverpod_listen_in_build).
// We need to react to auth state changes once the anonymous login resolves
// to drive the post-name onboarding fork.
_authSub = ref.listenManual<AsyncValue<AuthData>>(authProvider, (prev, next) {
if (!mounted) return;
if (next is AsyncError) {
setState(() => _errorMessage = next.error.toString());
return;
}
final data = next.valueOrNull;
if (data is AuthAnonymousData && !_routedAfterLogin) {
_routedAfterLogin = true;
// Anonymous identity established — activation step 6.
// ignore: discarded_futures
ref.read(analyticsProvider).logAuthComplete(AnalyticsUserType.anonymous);
_proceedAfterLogin();
}
});
}
@override
void dispose() {
_authSub?.close();
_controller.dispose();
super.dispose();
}
void _submit() {
final name = _controller.text.trim();
if (name.isEmpty) return;
setState(() => _errorMessage = null);
ref.read(authProvider.notifier).loginAnonymous(name);
}
/// After an anonymous login succeeds, decide where to send the user.
///
/// 1. Read `/api/client/onboarding-state`. If `has_consulted_before`, the
/// user is a returning customer — skip the onboarding sequence and
/// jump straight to the duration picker (Stage 3 owns that route).
/// 2. Otherwise show the Verif Choice Sheet and route based on the picked
/// branch.
Future<void> _proceedAfterLogin() async {
bool hasConsultedBefore = false;
try {
final response =
await ref.read(apiClientProvider).get('/api/client/onboarding-state');
final data = response['data'] as Map<String, dynamic>?;
hasConsultedBefore =
(data?['has_consulted_before'] as bool?) ?? false;
} catch (_) {
// Treat as first-time on failure — safer to over-collect onboarding
// info than to silently strand a returning user.
}
if (!mounted) return;
if (hasConsultedBefore) {
// TODO(stage3): Stage 3 will own /payment/duration-pick — for now
// route there as a placeholder so returning users can continue.
context.go('/payment/duration-pick');
return;
}
// ignore: discarded_futures
ref.read(analyticsProvider).logVerifChoiceView();
final choice = await VerifChoiceSheet.show(context);
if (!mounted || choice == null) {
// User dismissed the sheet — let them tap Lanjut again to retry. No
// select event: the view→select gap is the abandonment signal.
_routedAfterLogin = false;
return;
}
// ignore: discarded_futures
ref.read(analyticsProvider).logVerifChoiceSelect(choice);
if (!mounted) return;
await routeForVerifChoice(context, ref, choice);
}
@override
Widget build(BuildContext context) {
final authState = ref.watch(authProvider);
final isLoading = authState is AsyncLoading;
return Scaffold(
appBar: AppBar(title: const Text('Siapa namamu?')),
body: SafeArea(
child: Padding(
padding: const EdgeInsets.all(HaloSpacing.s24),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
const Text(
'Pilih nama yang ingin kamu gunakan. Nama ini akan terlihat oleh bestie kamu.',
style: TextStyle(
fontFamily: HaloTokens.fontBody,
fontSize: 15,
height: 22 / 15,
color: HaloTokens.inkSoft,
),
),
const SizedBox(height: HaloSpacing.s24),
TextField(
controller: _controller,
decoration: const InputDecoration(
labelText: 'Nama panggilan',
),
textInputAction: TextInputAction.done,
onSubmitted: (_) => _submit(),
),
if (_errorMessage != null) ...[
const SizedBox(height: HaloSpacing.s12),
Text(
_errorMessage!,
textAlign: TextAlign.center,
style: const TextStyle(
fontFamily: HaloTokens.fontBody,
color: HaloTokens.danger,
fontSize: 13,
),
),
],
const SizedBox(height: HaloSpacing.s24),
HaloButton(
label: isLoading ? 'memproses...' : 'lanjut',
fullWidth: true,
onPressed: isLoading ? null : _submit,
),
],
),
),
),
);
}
}