import 'dart:io';

import 'package:Envelope/components/file_picker.dart';
import 'package:flutter/material.dart';
import 'package:image_picker/image_picker.dart';

import '/components/custom_circle_avatar.dart';
import '/models/conversations.dart';

class ConversationEditDetails extends StatefulWidget {
  final Function(String conversationName, File? conversationIcon) saveCallback;
  final Conversation? conversation;
  const ConversationEditDetails({
    Key? key,
    required this.saveCallback,
    this.conversation,
  }) : super(key: key);

  @override
  State<ConversationEditDetails> createState() => _ConversationEditDetails();
}

class _ConversationEditDetails extends State<ConversationEditDetails> {
  final _formKey = GlobalKey<FormState>();

  List<Conversation> conversations = [];

  TextEditingController conversationNameController = TextEditingController();
  File? conversationIcon;

  bool showFileSelector = false;

  @override
  void initState() {
    if (widget.conversation != null) {
      conversationNameController.text = widget.conversation!.name;
      conversationIcon = widget.conversation!.icon;
    }
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    const TextStyle inputTextStyle = TextStyle(
        fontSize: 25,
    );

    final OutlineInputBorder inputBorderStyle = OutlineInputBorder(
        borderRadius: BorderRadius.circular(5),
        borderSide: const BorderSide(
            color: Colors.transparent,
        )
    );

    final ButtonStyle buttonStyle = ElevatedButton.styleFrom(
        padding: const EdgeInsets.symmetric(horizontal: 30, vertical: 10),
        textStyle: TextStyle(
            fontSize: 15,
            fontWeight: FontWeight.bold,
            color: Theme.of(context).colorScheme.error,
        ),
    );

    return Scaffold(
      appBar: AppBar(
        elevation: 0,
        automaticallyImplyLeading: false,
        flexibleSpace: SafeArea(
          child: Container(
            padding: const EdgeInsets.only(right: 16),
            child: Row(
              children: <Widget>[
                IconButton(
                  onPressed: (){
                    Navigator.pop(context);
                  },
                  icon: const Icon(Icons.arrow_back),
                ),
                const SizedBox(width: 2,),
                Expanded(
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: <Widget>[
                      Text(
                        widget.conversation != null ?
                        widget.conversation!.name + ' Settings' :
                        'Add Conversation',
                        style: const TextStyle(
                            fontSize: 16,
                            fontWeight: FontWeight.w600
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),
        ),
      ),

      body: Center(
        child: Padding(
          padding: const EdgeInsets.only(
              top: 50,
              left: 25,
              right: 25,
          ),
          child: Form(
            key: _formKey,
            child: Column(
              children: [

                CustomCircleAvatar(
                  icon: const Icon(Icons.people, size: 60),
                  image: conversationIcon,
                  radius: 50,
                  editImageCallback: () {
                    setState(() {
                      showFileSelector = true;
                    });
                  },
                ),

                const SizedBox(height: 20),

                showFileSelector ?
                  Padding(
                    padding: const EdgeInsets.only(bottom: 10),
                    child: FilePicker(
                      cameraHandle: (XFile image) {
                        setState(() {
                          conversationIcon = File(image.path);
                          showFileSelector = false;
                        });
                      },
                      galleryHandleSingle: (XFile image) async {
                        setState(() {
                          conversationIcon = File(image.path);
                          showFileSelector = false;
                        });
                      },
                    ),
                  ) :
                  const SizedBox(height: 10),

                TextFormField(
                  controller: conversationNameController,
                  textAlign: TextAlign.center,
                  decoration: InputDecoration(
                    hintText: 'Title',
                    enabledBorder: inputBorderStyle,
                    focusedBorder: inputBorderStyle,
                  ),
                  style: inputTextStyle,
                  // The validator receives the text that the user has entered.
                  validator: (value) {
                    if (value == null || value.isEmpty) {
                      return 'Add a title';
                    }
                    return null;
                  },
                ),

                const SizedBox(height: 30),

                ElevatedButton(
                  style: buttonStyle,
                  onPressed: () {
                    if (!_formKey.currentState!.validate()) {
                      return;
                    }

                    widget.saveCallback(
                      conversationNameController.text,
                      conversationIcon,
                    );
                  },
                  child: const Text('Save'),
                ),

              ],
            ),
          ),
        ),
      ),
    );
  }
}