import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_application_1/Project/ProfilePage/EditProfilePage/edit_profile_page.dart';
import 'package:flutter_application_1/Project/ProfilePage/widgets/appbar_widget.dart';
import 'package:string_validator/string_validator.dart';
import '../../utils/colors.dart';

class EditPhoneFormPage extends StatefulWidget {
  const EditPhoneFormPage({Key? key}) : super(key: key);
  @override
  EditPhoneFormPageState createState() {
    return EditPhoneFormPageState();
  }
}

class EditPhoneFormPageState extends State<EditPhoneFormPage> {
  final _formKey = GlobalKey<FormState>();
  final CollectionReference usersCollection =
      FirebaseFirestore.instance.collection('users');
  final phoneController = TextEditingController();
  bool isValid = true;

  @override
  void initState() {
    super.initState();
    phoneController.addListener(() {});
  }

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

  void clearForm() {
    phoneController.clear();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: buildAppBar(context),
      body: Form(
        key: _formKey,
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisAlignment: MainAxisAlignment.start,
          children: <Widget>[
            const SizedBox(
                width: 320,
                child: Text(
                  "What's Your New Phone Number?",
                  style: TextStyle(fontSize: 22, fontWeight: FontWeight.bold),
                )),
            Padding(
              padding: const EdgeInsets.only(top: 40),
              child: SizedBox(
                height: 100,
                width: 320,
                child: TextFormField(
                  keyboardType: TextInputType.phone,
                  inputFormatters: <TextInputFormatter>[
                    FilteringTextInputFormatter.digitsOnly,
                    LengthLimitingTextInputFormatter(9)
                  ],
                  // Handles Form Validation
                  validator: (value) {
                    if (value == null || value.isEmpty) {
                      return 'Please enter your phone number';
                    } else if (isAlpha(value)) {
                      return 'Only Numbers Please';
                    } else if (value.length > 9) {
                      return 'Please enter a VALID phone number';
                    }
                    return null;
                  },
                  controller: phoneController,
                  decoration: const InputDecoration(
                    labelText: 'Your Phone Number',
                    prefixText: '(+66) ',
                  ),
                ),
              ),
            ),
            Padding(
              padding: const EdgeInsets.only(top: 150),
              child: Align(
                alignment: Alignment.bottomCenter,
                child: SizedBox(
                  width: 320,
                  height: 50,
                  child: ElevatedButton(
                    onPressed: () async {
                     setState(() {
                        isValid = _formKey.currentState!.validate();
                      });

                      if (isValid) {
                        // Get the user ID of the current user
                        final String? uid =
                            FirebaseAuth.instance.currentUser?.uid;

                      if (uid != null) {
                        // Get the DocumentReference of the user's document
                        final DocumentReference userDocRef =
                            usersCollection.doc(uid);

                        final String phone = phoneController.text.trim();

                        // Update the user's document with the new values
                        await userDocRef.update({
                          'phone': '+66$phone',
                        });

                       // Navigate back to the previous screen
                          // ignore: use_build_context_synchronously
                          Navigator.push(
                              context,
                              MaterialPageRoute(
                                  builder: ((context) =>
                                      const EditProfilePage())));
                        }
                      } else {
                        // Display an error message
                        ScaffoldMessenger.of(context).showSnackBar(
                          const SnackBar(
                            content:
                                Text('Error: Please enter your phone number'),
                            duration: Duration(seconds: 3),
                          ),
                        );
                      }
                    },
                    style: ButtonStyle(
                      backgroundColor: MaterialStateProperty.all<Color>(kGreenColor),
                    ),
                    child: const Text(
                      'Update',
                      style: TextStyle(fontSize: 15),
                    ),
                  ),
                ),
              ),
            )
          ],
        ),
      ),
    );
  }
}