halobestie-clone/client_app/lib/features/onboarding/screens/esp_screen.dart

import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import '../../../core/theme/halo_tokens.dart';
import '../../../core/theme/widgets/widgets.dart';
import '../esp_state.dart';
import '../esp_topic.dart';

/// Onboarding step 1 — multi-select chip grid for ESP topics. Picks are
/// persisted on the chat session at session-start time and surfaced read-only
/// to the mitra. They do NOT affect matching, pricing, or routing.
///
/// Routed under both `/onboarding/verif/esp` and `/onboarding/anon/esp` —
/// the parent flow path determines the next destination after Lanjut.
class EspScreen extends ConsumerWidget {
  /// `verified` ➞ ESP → USP → OTP.
  /// `anonymous` ➞ ESP → USP → /payment/method-pick (Stage 3).
  final bool verified;

  const EspScreen({super.key, required this.verified});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final selected = ref.watch(espSelectionProvider);

    return Scaffold(
      appBar: AppBar(
        title: const Padding(
          padding: EdgeInsets.only(top: HaloSpacing.s4),
          child: HaloStepDots(total: 4, current: 1),
        ),
        centerTitle: true,
        actions: [
          TextButton(
            onPressed: () => _onSkip(context, ref),
            child: const Text('lewati'),
          ),
        ],
      ),
      body: SafeArea(
        top: false,
        child: Padding(
          padding: const EdgeInsets.fromLTRB(
            HaloSpacing.s24,
            HaloSpacing.s8,
            HaloSpacing.s24,
            HaloSpacing.s24,
          ),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              const Text(
                'Lagi mikirin apa?',
                style: TextStyle(
                  fontFamily: HaloTokens.fontDisplay,
                  fontSize: 26,
                  height: 30 / 26,
                  fontWeight: FontWeight.w700,
                  color: HaloTokens.ink,
                ),
              ),
              const SizedBox(height: HaloSpacing.s8),
              const Text(
                'Pilih topik yang nyangkut sama ceritamu. Nggak ada yang nyambung pun nggak apa-apa, bisa dilewati.',
                style: TextStyle(
                  fontFamily: HaloTokens.fontBody,
                  fontSize: 14,
                  height: 20 / 14,
                  color: HaloTokens.inkSoft,
                ),
              ),
              const SizedBox(height: HaloSpacing.s24),
              Expanded(
                child: SingleChildScrollView(
                  child: Wrap(
                    spacing: HaloSpacing.s8,
                    runSpacing: HaloSpacing.s8,
                    children: EspTopic.values.map((topic) {
                      final isOn = selected.contains(topic);
                      return HaloChip(
                        label: topic.label,
                        selected: isOn,
                        onTap: () => _toggle(ref, topic),
                      );
                    }).toList(),
                  ),
                ),
              ),
              const SizedBox(height: HaloSpacing.s16),
              HaloButton(
                label: 'lanjut',
                fullWidth: true,
                onPressed: () => _onContinue(context, ref),
              ),
            ],
          ),
        ),
      ),
    );
  }

  void _toggle(WidgetRef ref, EspTopic topic) {
    final current = ref.read(espSelectionProvider);
    final next = Set<EspTopic>.from(current);
    if (!next.add(topic)) next.remove(topic);
    ref.read(espSelectionProvider.notifier).state = next;
    if (ref.read(espSkippedProvider)) {
      ref.read(espSkippedProvider.notifier).state = false;
    }
  }

  void _onSkip(BuildContext context, WidgetRef ref) {
    ref.read(espSelectionProvider.notifier).state = <EspTopic>{};
    ref.read(espSkippedProvider.notifier).state = true;
    _goNext(context);
  }

  void _onContinue(BuildContext context, WidgetRef ref) {
    if (ref.read(espSelectionProvider).isEmpty) {
      ref.read(espSkippedProvider.notifier).state = true;
    } else {
      ref.read(espSkippedProvider.notifier).state = false;
    }
    _goNext(context);
  }

  void _goNext(BuildContext context) {
    final next =
        verified ? '/onboarding/verif/usp' : '/onboarding/anon/usp';
    context.push(next);
  }
}