import 'package:didvan/config/theme_data.dart';
import 'package:didvan/constants/app_icons.dart';
import 'package:didvan/widgets/didvan/icon_button.dart';
import 'package:flutter/material.dart';

class SearchField extends StatefulWidget {
  final String title;
  final void Function(String value) onChanged;
  final VoidCallback? onFilterButtonPressed;

  const SearchField({
    Key? key,
    required this.title,
    required this.onChanged,
    this.onFilterButtonPressed,
  }) : super(key: key);

  @override
  State<SearchField> createState() => _SearchFieldState();
}

class _SearchFieldState extends State<SearchField> {
  final FocusNode _focusNode = FocusNode();

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

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: 40,
      child: Row(
        children: [
          Expanded(
            child: Container(
              decoration: BoxDecoration(
                color: _fillColor(),
              ),
              child: TextField(
                focusNode: _focusNode,
                style: Theme.of(context).textTheme.bodyText1,
                textAlignVertical: TextAlignVertical.center,
                onChanged: widget.onChanged,
                keyboardType: TextInputType.text,
                textInputAction: TextInputAction.search,
                decoration: InputDecoration(
                  focusedBorder: OutlineInputBorder(
                    borderRadius: const BorderRadius.all(
                      Radius.circular(4),
                    ),
                    borderSide: BorderSide(
                      color: Theme.of(context).colorScheme.primary,
                    ),
                  ),
                  prefixIcon: Icon(
                    DidvanIcons.search_regular,
                    color: Theme.of(context).colorScheme.text,
                  ),
                  prefixIconColor: Theme.of(context).colorScheme.inputText,
                  enabledBorder: OutlineInputBorder(
                    borderRadius: const BorderRadius.all(
                      Radius.circular(4),
                    ),
                    borderSide: BorderSide(
                      color: Theme.of(context).colorScheme.border,
                    ),
                  ),
                  fillColor: Colors.red,
                  contentPadding: const EdgeInsets.only(
                    left: 12,
                    right: 12,
                  ),
                  border: InputBorder.none,
                  hintText: 'جستجو مطلب در ${widget.title}',
                  hintStyle: TextStyle(
                      color: Theme.of(context).colorScheme.disabledText),
                ),
              ),
            ),
          ),
          if (widget.onFilterButtonPressed != null) const SizedBox(width: 8),
          if (widget.onFilterButtonPressed != null)
            DidvanIconButton(
              onPressed: widget.onFilterButtonPressed!,
              icon: DidvanIcons.filter_regular,
              size: 32,
              gestureSize: 32,
            ),
        ],
      ),
    );
  }

  Color _fillColor() {
    if (_focusNode.hasFocus) {
      return Theme.of(context).colorScheme.surface;
    }
    return Theme.of(context).colorScheme.surface;
  }
}