import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:intl_phone_field/intl_phone_field.dart';
import 'package:prosappco/src/controllers/phone_auth_controller.dart';

class NewNumberScreen extends StatefulWidget {
  const NewNumberScreen({super.key});

  @override
  State<NewNumberScreen> createState() => _NewNumberScreenState();
}

// Actualizar número de teléfono en Firebase
Future<void> updatePhoneNumber(String verificationId, String smsCode) async {
  try {
    PhoneAuthCredential credential = PhoneAuthProvider.credential(
        verificationId: verificationId, smsCode: smsCode);
    await FirebaseAuth.instance.currentUser!.updatePhoneNumber(credential);
    print("Phone number updated successfully");
  } catch (e) {
    print("Error updating phone number: $e");
  }
}

class _NewNumberScreenState extends State<NewNumberScreen> {
  String completePhoneNumber = '';
  final _formKey = GlobalKey<FormState>();

  @override
  Widget build(BuildContext context) {
    return SafeArea(
        child: Scaffold(
      resizeToAvoidBottomInset: false,
      appBar: AppBar(
          backgroundColor: Colors.white,
          iconTheme: IconThemeData(
            color: Colors.black,
          ),
          title: Text(
            'Añadir numero',
            style: TextStyle(
              color: Colors.black,
            ),
          )),
      body: Container(
        padding: const EdgeInsets.symmetric(horizontal: 0, vertical: 20),
        margin: const EdgeInsets.only(top: 30, left: 50, right: 50),
        child: Column(children: [
          const Padding(
              padding: EdgeInsets.only(bottom: 5),
              child: Align(
                alignment: Alignment.topLeft,
                child: Text('Numero de celular',
                    style: TextStyle(fontSize: 18.0, color: Color(0xFF65676B))),
              )),
          Form(
            key: _formKey,
            child: Padding(
              padding: EdgeInsets.only(bottom: 5),
              child: IntlPhoneField(
                // controller: controller.phoneNo,
                initialCountryCode: 'CO',
                onChanged: (phoneNo) {
                  completePhoneNumber = phoneNo.completeNumber;
                },
                decoration: InputDecoration(
                  enabledBorder: OutlineInputBorder(
                      borderSide: BorderSide(color: Color(0xFFECECEC)),
                      borderRadius: BorderRadius.all(
                        Radius.circular(50),
                      )),
                  focusedBorder: OutlineInputBorder(
                      borderSide: BorderSide(color: Color(0xFFECECEC)),
                      borderRadius: BorderRadius.all(
                        Radius.circular(50),
                      )),
                  fillColor: Color.fromARGB(255, 239, 239, 239),
                  filled: true,
                ),
              ),
            ),
          ),
          const Padding(
            padding: EdgeInsets.only(bottom: 30),
            child: Text('Un código será enviado a este numero de celular.',
                textAlign: TextAlign.center,
                style: TextStyle(fontSize: 13.0, color: Color(0xFF65676B))),
          ),
          Padding(
            padding: EdgeInsets.only(bottom: 30),
            child: Center(
                child: ElevatedButton(
              onPressed: () {
                // updatePhoneNumber(completePhoneNumber, '123456');

                if (_formKey.currentState!.validate()) {
                  PhoneAuthController.instance.phoneAuthentication(
                    completePhoneNumber.trim(),
                  );
                  Get.to(NewNumberScreen());
                }
              },
              child: Text(
                'Enviar código',
                style: TextStyle(
                  color: Colors.white,
                  fontWeight: FontWeight.bold,
                  fontSize: 18,
                ),
              ),
              style: ElevatedButton.styleFrom(
                primary: Color(0xFF2BA4EC), // Color del botón
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(50), // Bordes redondeados
                ),
                elevation: 0,
                minimumSize: Size(230, 60), // Tamaño mínimo del botón
              ),
            )),
          ),
        ]),
      ),
    ));
  }
}