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

class SearchField extends StatefulWidget {
  final String title;
  final FocusNode focusNode;
  final bool? isFiltered;
  final void Function(String value) onChanged;
  final VoidCallback? onFilterButtonPressed;
  final VoidCallback? onGoBack;
  final String? value;

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

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

class _SearchFieldState extends State<SearchField> {
  @override
  void initState() {
    widget.focusNode.addListener(() {
      if (mounted) {
        setState(() {});
      }
    });
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: 40,
      child: Row(
        children: [
          Expanded(
            child: Container(
              decoration: BoxDecoration(
                color: _fillColor(),
              ),
              child: TextFormField(
                initialValue: widget.value,
                focusNode: widget.focusNode,
                style: Theme.of(context).textTheme.bodyMedium,
                textAlignVertical: TextAlignVertical.center,
                onChanged: widget.onChanged,
                keyboardType: TextInputType.text,
                textInputAction: TextInputAction.search,
                decoration: InputDecoration(
                  suffixIcon: widget.onFilterButtonPressed != null
                      ? SizedBox(
                          width: 48,
                          child: Align(
                            alignment: Alignment.centerLeft,
                            child: Padding(
                              padding: const EdgeInsets.only(left: 8),
                              child: Row(
                                mainAxisSize: MainAxisSize.min,
                                children: [
                                  Container(
                                    margin: const EdgeInsets.only(left: 4),
                                    height: 24,
                                    width: 1,
                                    color: Theme.of(context).colorScheme.border,
                                  ),
                                  Stack(
                                    children: [
                                      DidvanIconButton(
                                        onPressed:
                                            widget.onFilterButtonPressed!,
                                        icon: widget.isFiltered!
                                            ? DidvanIcons.filter_solid
                                            : DidvanIcons.filter_regular,
                                        size: 24,
                                        gestureSize: 24,
                                      ),
                                      if (widget.isFiltered!)
                                        Positioned(
                                          child: Container(
                                            width: 10,
                                            height: 10,
                                            decoration: BoxDecoration(
                                              shape: BoxShape.circle,
                                              color: Theme.of(context)
                                                  .colorScheme
                                                  .secondary,
                                            ),
                                          ),
                                        ),
                                    ],
                                  ),
                                ],
                              ),
                            ),
                          ),
                        )
                      : null,
                  focusedBorder: OutlineInputBorder(
                    borderRadius: const BorderRadius.all(
                      Radius.circular(4),
                    ),
                    borderSide: BorderSide(
                      color: Theme.of(context).colorScheme.primary,
                    ),
                  ),
                  prefixIcon: GestureDetector(
                    onTap: widget.onGoBack,
                    child: Icon(
                      widget.onGoBack == null
                          ? DidvanIcons.search_regular
                          : DidvanIcons.back_light,
                      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,
                  ),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

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

  @override
  void dispose() {
    widget.focusNode.removeListener(() {});
    super.dispose();
  }
}
