import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:regroup/Utils/Common/sized_box.dart';

import 'package:regroup/Utils/texts.dart';
import 'package:remove_emoji_input_formatter/remove_emoji_input_formatter.dart';
import 'package:path/path.dart' as path;
import 'package:intl/intl.dart';

// ignore: must_be_immutable
class TextInputField extends StatefulWidget {
  TextInputField({Key? key, this.hinttext, this.controller, this.validator})
      : super(key: key);
  final String? hinttext;
  final TextEditingController? controller;
  dynamic validator;

  @override
  State<TextInputField> createState() => _TextInputFieldState();
}

class _TextInputFieldState extends State<TextInputField> {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      height: 46.h,
      child: TextFormField(
        inputFormatters: [
          RemoveEmojiInputFormatter(),
        ],
        controller: widget.controller,
        validator: widget.validator ??
            (value) {
              if (value == null || value.isEmpty) {
                return "Empty value";
              }
              return null;
            },
        decoration: InputDecoration(
          contentPadding: const EdgeInsets.symmetric(
              vertical: 12.0,
              horizontal: 16), //<-- Adjust the vertical padding as needed

          hintText: widget.hinttext,
          focusedBorder: OutlineInputBorder(
            borderSide: const BorderSide(
                width: 1, color: Color(0x7FE8C69F)), //<-- SEE HERE
            borderRadius: BorderRadius.circular(5.0),
          ),
          border: OutlineInputBorder(
            borderSide: const BorderSide(
                width: 1, color: Color(0x7FE8C69F)), //<-- SEE HERE
            borderRadius: BorderRadius.circular(5.0),
          ),
          enabledBorder: OutlineInputBorder(
            borderSide: const BorderSide(
                width: 1, color: Color(0x7FE8C69F)), //<-- SEE HERE
            borderRadius: BorderRadius.circular(5.0),
          ),
        ),
      ),
    );
  }
}

Widget MessageTextInputField(
    String hinttext, TextEditingController controller, dynamic validator) {
  return TextFormField(
    inputFormatters: [RemoveEmojiInputFormatter()],
    // maxLength: 5,
    autovalidateMode: AutovalidateMode.onUserInteraction,
    maxLines: 5,
    validator: validator,
    controller: controller,
    decoration: InputDecoration(
      labelStyle: const TextStyle(color: Colors.black),
      errorStyle: TextStyle(
        fontSize: 13.sp,
        color: const Color.fromARGB(255, 245, 130, 122),
      ),
      contentPadding: const EdgeInsets.symmetric(
          vertical: 12.0,
          horizontal: 16), //<-- Adjust the vertical padding as needed
      filled: true,
      fillColor: const Color(0xFFFFF3E4),
      border: OutlineInputBorder(
        borderRadius: BorderRadius.circular(5),
        borderSide: const BorderSide(color: Color(0xFFE8C69F80), width: 1),
      ),
      enabledBorder: OutlineInputBorder(
        borderRadius: BorderRadius.circular(5),
        borderSide: const BorderSide(color: Color(0xFFE8C69F80), width: 1),
      ),
      focusedBorder: OutlineInputBorder(
        borderRadius: BorderRadius.circular(5),
        borderSide: const BorderSide(color: Color(0xFFE8C69F80), width: 1),
      ),
      errorBorder: OutlineInputBorder(
        borderRadius: BorderRadius.circular(5),
        borderSide: const BorderSide(color: Colors.red, width: 1),
      ),
      focusedErrorBorder: OutlineInputBorder(
        borderRadius: BorderRadius.circular(5),
        borderSide: const BorderSide(color: Colors.red, width: 1),
      ),
      hintText: hinttext,
      hintStyle: const TextStyle(
          color: Color(0xFF737373),
          fontSize: 14,
          fontWeight: FontWeight.w400,
          fontFamily: "DM Sans"),

      // focusedBorder: const OutlineInputBorder(borderSide: BorderSide.none),
      // border: const OutlineInputBorder(borderSide: BorderSide.none),
      // enabledBorder: const OutlineInputBorder(borderSide: BorderSide.none),
    ),
    keyboardType: TextInputType.text,
  );
}

Widget commonDivider() {
  return Container(
    height: 1.5.h,
    width: double.infinity,
    decoration: const BoxDecoration(
      gradient: LinearGradient(
        begin: Alignment.topLeft,
        end: Alignment.bottomRight,
        colors: [
          Color.fromRGBO(255, 255, 255, 0.07),
          Color.fromRGBO(255, 255, 255, 0.09),
        ],
        transform: GradientRotation(1.78),
      ),
    ),
  );
}

String extractFileName(String filePath) {
  return path.basename(filePath);
}

Future<void> datePicker(
    BuildContext context, TextEditingController controller) async {
  final ThemeData customTheme = Theme.of(context).copyWith(
      colorScheme: const ColorScheme.light(
          primary: Color(0xFFD90B2E),
          surfaceTint: Color(0xFF222935),
          surface: Color(0xFF222935),
          onPrimary: Colors.white,
          onSurface: Colors.white,
          onSecondary: Colors.white),
      textButtonTheme: TextButtonThemeData(
        style: TextButton.styleFrom(
          foregroundColor: const Color(0xFFD90B2E),
        ),
      ));
  final DateTime? picked = await showDatePicker(
    context: context,
    initialDate: DateTime.now(),
    firstDate: DateTime(1900),
    lastDate: DateTime(2100),
    builder: (BuildContext context, Widget? child) {
      return Theme(
        data: customTheme,
        child: child!,
      );
    },
  );

  if (picked != null) {
    controller.text = DateFormat('yyyy-MM-dd').format(picked);
  }
}

Future<TimeOfDay?> showCustomTimePicker(BuildContext context,
    {TimeOfDay? initialTime}) {
  final ThemeData customTheme2 = Theme.of(context).copyWith(
      colorScheme: const ColorScheme.light(
        primary: Color(0xFFD90B2E),
        surfaceTint: Color(0xFF222935),
        surface: Color(0xFF222935),
        onPrimary: Colors.white,
        onSurface: Colors.white,
      ),
      textTheme: Theme.of(context).textTheme.copyWith(
            titleLarge: const TextStyle(color: Colors.blue), // Change the title color
          ),
      textButtonTheme: TextButtonThemeData(
        style: TextButton.styleFrom(
          foregroundColor: const Color(0xFFD90B2E),
        ),
      ));
  return showTimePicker(
    context: context,
    initialTime: initialTime ?? TimeOfDay.now(),
    builder: (BuildContext context, Widget? child) {
      return Theme(
        data: customTheme2,
        child: child!,
      );
    },
  );
}

Widget stackContainers({
  required String number,
  required List<String> containerImages,
}) {
  return Row(
    children: [
      Stack(
        clipBehavior: Clip.none,
        children: [
          Container(
            height: 30,
            width: 30,
            decoration: BoxDecoration(
              shape: BoxShape.circle,
              color: const Color(0xFFD90B2E),
              border: Border.all(color: const Color(0xFF2C3742), width: 1),
            ),
            child: Center(
              child: Text(
                number,
                style: const TextStyle(
                  color: Colors.white,
                  fontWeight: FontWeight.w400,
                  fontSize: 8,
                ),
              ),
            ),
          ),
          Positioned(
            left: 22.w,
            child: SizedBox(
              height: 30,
              width: 50,
              child: Stack(
                clipBehavior: Clip.none,
                children: List.generate(containerImages.length, (index) {
                  return Positioned(
                    left: index * 22.w,
                    child: Container(
                      height: 30,
                      width: 30,
                      decoration: BoxDecoration(
                        shape: BoxShape.circle,
                        border: Border.all(color: const Color(0xFF2C3742), width: 1),
                      ),
                      child: CircleAvatar(
                        foregroundImage: AssetImage(containerImages[index]),
                      ),
                    ),
                  );
                }),
              ),
            ),
          ),
        ],
      ),
    ],
  );
}

Widget stackContainersGroups({
  required String number,
  required List<String> containerImages,
}) {
  // Define the maximum number of images to display
  const maxImagesToShow = 3;

  // Calculate the number of images to show and the remaining count
  final remainingCount = containerImages.length - maxImagesToShow;
  final imagesToShow = containerImages.take(maxImagesToShow).toList();

  return Row(
    children: [
      Stack(
        clipBehavior: Clip.none,
        children: [
          Container(
            height: 30,
            width: 30,
            decoration: BoxDecoration(
              shape: BoxShape.circle,
              color: const Color(0xFFD90B2E),
              border: Border.all(color: const Color(0xFF2C3742), width: 1),
            ),
            child: Center(
              child: Text(
                remainingCount > 0 ? '+$remainingCount' : '',
                style: const TextStyle(
                  color: Colors.white,
                  fontWeight: FontWeight.w400,
                  fontSize: 8,
                ),
              ),
            ),
          ),
          Positioned(
            left: 22.w,
            child: SizedBox(
              height: 30,
              width: 30 * maxImagesToShow.toDouble(),
              child: Stack(
                clipBehavior: Clip.none,
                children: List.generate(imagesToShow.length, (index) {
                  return Positioned(
                    left: index * 22.0,
                    child: Container(
                      height: 30,
                      width: 30,
                      decoration: BoxDecoration(
                        shape: BoxShape.circle,
                        border: Border.all(color: const Color(0xFF2C3742), width: 1),
                      ),
                      child: CircleAvatar(
                        backgroundImage: NetworkImage(imagesToShow[index]),
                      ),
                    ),
                  );
                }),
              ),
            ),
          ),
        ],
      ),
    ],
  );
}

Widget stackContainers2({
  required List<String> containerImages,
}) {
  return Row(
    children: [
      sizedBoxWidth(16.w),
      SizedBox(
        height: 30,
        width: 50,
        child: Stack(
          clipBehavior: Clip.none,
          children: List.generate(containerImages.length, (index) {
            return Positioned(
              left: index * 25.0,
              child: Container(
                height: 40,
                width: 40,
                decoration: BoxDecoration(
                  shape: BoxShape.circle,
                  border: Border.all(color: const Color(0xFF2C3742), width: 1),
                ),
                child: CircleAvatar(
                  foregroundImage: AssetImage(containerImages[index]),
                ),
              ),
            );
          }),
        ),
      ),
    ],
  );
}

Widget stackReaction({
  required String number,
  required List<String> containerImages,
}) {
  return Row(children: [
    SizedBox(
      height: 50,
      width: 50,
      child: Stack(
        clipBehavior: Clip.none,
        children: List.generate(containerImages.length, (index) {
          return Positioned(
              top: 6.h,
              left: index * 23.w,
              child: Container(
                width: 30.w,
                height: 30.h,
                decoration: BoxDecoration(
                    shape: BoxShape.circle,
                    gradient: LinearGradient(
                      begin: Alignment.topLeft,
                      end: Alignment.bottomRight,
                      colors: [
                        const Color(0xFFFFFFFF).withOpacity(0.1),
                        const Color(0xFFFFFFFF).withOpacity(0.06),
                      ],
                      stops: const [
                        0.1,
                        1,
                      ],
                    ),
                    border: Border.all(color: const Color(0xFF1E3A46), width: 1.71)),
                child: Center(
                  child: Image.asset(
                    containerImages[index],
                    height: 18.h,
                    width: 18.w,
                  ),
                ),
              ));
        }),
      ),
    ),
    sizedBoxWidth(40.w),
    text12w400_FCFCFC(number),
  ]);
}