import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../../core/auth/auth_bloc.dart';

class OtpScreen extends StatefulWidget {
  final String phone;
  const OtpScreen({super.key, required this.phone});

  @override
  State<OtpScreen> createState() => _OtpScreenState();
}

class _OtpScreenState extends State<OtpScreen> {
  final _otpController = TextEditingController();

  @override
  void dispose() {
    _otpController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return BlocListener<AuthBloc, AuthState>(
      listener: (context, state) {
        if (state is AuthError) {
          ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text(state.message)));
        }
      },
      child: Scaffold(
        appBar: AppBar(title: const Text('Masukkan OTP')),
        body: Padding(
          padding: const EdgeInsets.all(24),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: [
              Text('Kode OTP telah dikirim ke ${widget.phone}'),
              const SizedBox(height: 24),
              TextField(
                controller: _otpController,
                decoration: const InputDecoration(
                  labelText: 'Kode OTP',
                  border: OutlineInputBorder(),
                ),
                keyboardType: TextInputType.number,
                maxLength: 6,
              ),
              const SizedBox(height: 12),
              BlocBuilder<AuthBloc, AuthState>(
                builder: (context, state) => ElevatedButton(
                  onPressed: state is AuthLoading ? null : () {
                    final otp = _otpController.text.trim();
                    if (otp.length != 6) return;
                    final verificationId = state is AuthOtpSent ? state.verificationId : '';
                    context.read<AuthBloc>().add(OtpVerified(verificationId, otp));
                  },
                  child: state is AuthLoading
                      ? const CircularProgressIndicator()
                      : const Text('Verifikasi'),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}