import 'package:flutter/material.dart';

import '../utils/auth_utils.dart';

class CustomTextFieldForexWrapper extends StatefulWidget {
  final Widget child;
  final bool isFocused;
  final bool isDesktop;
  final double? width;
  final Color? color;
  final VoidCallback? onFocusChange; // Callback for focus handling
  final EdgeInsetsGeometry padding;

  const CustomTextFieldForexWrapper({
    super.key,
    required this.child,
    required this.isFocused,
    required this.isDesktop,
    this.width,
    this.color = Colors.white,
    this.onFocusChange,
    this.padding = const EdgeInsets.symmetric(horizontal: 12),
  });

  @override
  _CustomTextFieldForexWrapperState createState() =>
      _CustomTextFieldForexWrapperState();
}

class _CustomTextFieldForexWrapperState
    extends State<CustomTextFieldForexWrapper> {
  Color? layoutColor;

  @override
  void initState() {
    super.initState();

    WidgetsBinding.instance.addPostFrameCallback((_) {
      loadInitialData();
    });
  }

  void loadInitialData() async {
    String? layoutString = await getLayoutColor();

    setState(() {
      layoutColor =
          layoutString != null
              ? Color(int.parse(layoutString))
              : Colors.redAccent;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      width:
          widget.width ?? // Use custom width if provided, else default
          (widget.isDesktop
              ? MediaQuery.of(context).size.width * 0.2
              : MediaQuery.of(context).size.width * 0.8),
      padding: widget.padding,
      decoration: BoxDecoration(
        // color: widget.color,
        color: Colors.white,
        borderRadius: BorderRadius.circular(8),
        border: Border.all(
          color: widget.isFocused ? layoutColor! : Color(0xFFD6D5E6),
          // color: widget.isFocused ? Color(0xFF78B4FC) : Color(0xFFD6D5E6),
          width: widget.isFocused ? 1.0 : 0.5,
        ),
        // boxShadow:
        //     widget.isFocused
        //         ? [
        //           BoxShadow(
        //             color: Colors.white,
        //             // color: Color.fromRGBO(120, 180, 252, 0.3),
        //             // color: Color.fromRGBO(120, 180, 252, 0.3),
        //             blurRadius: 5,
        //             spreadRadius: 2,
        //             offset: Offset(0, 1),
        //           ),
        //         ]
        //         : [],
      ),
      // decoration: BoxDecoration(
      //   color: widget.color,
      //   //   color: Color(0xFFF7F7FB),
      //   borderRadius: BorderRadius.circular(10),
      //   border: Border.all(
      //     color: widget.isFocused ? Color(0xFF78B4FC) : Color(0xFFD6D5E6),
      //     width: widget.isFocused ? 2.0 : 0.5,
      //   ),
      //   boxShadow: widget.isFocused
      //       ? [
      //           BoxShadow(
      //             color: Color.fromRGBO(120, 180, 252, 0.3),
      //             blurRadius: 10,
      //             spreadRadius: 2,
      //             offset: Offset(0, 4),
      //           ),
      //         ]
      //       : [],
      // ),
      child: widget.child,
    );
  }
}