import 'package:flutter/material.dart';
import 'package:supplier_new/common/settings.dart';

class SearchOrderAppBar extends StatefulWidget implements PreferredSizeWidget {

  final TextEditingController controller;
  final VoidCallback onBack;
  final VoidCallback onHelp;
  final Function(String)? onSearch;

  const SearchOrderAppBar({
    super.key,
    required this.controller,
    required this.onBack,
    required this.onHelp,
    required this.onSearch,
  });

  @override
  State<SearchOrderAppBar> createState() => _SearchOrderAppBarState();

  @override
  Size get preferredSize => const Size.fromHeight(kToolbarHeight);

}

class _SearchOrderAppBarState extends State<SearchOrderAppBar>{

  late VoidCallback _listener;

  @override
  void initState(){

    super.initState();

    _listener = (){

      if(!mounted) return;

      setState((){});

    };

    widget.controller.addListener(_listener);

  }

  @override
  void dispose(){

    widget.controller.removeListener(_listener);

    super.dispose();

  }

  @override
  Widget build(BuildContext context) {

    return AppBar(

      backgroundColor: Colors.white,

      scrolledUnderElevation: 0,

      elevation: 0,

      leading: GestureDetector(

        onTap: widget.onBack,

        child: Padding(

          padding: const EdgeInsets.all(8.0),

          child: Image.asset(

            'images/backbutton_appbar.png',

            height: 24,

            width: 24,

            fit: BoxFit.contain,

          ),

        ),

      ),

      titleSpacing: 0,

      title: Container(

        height: 40,

        decoration: BoxDecoration(

          color: Colors.white,

          borderRadius: BorderRadius.circular(22),

          border: Border.all(color: const Color(0XFF939495)),

        ),

        child: TextField(

          controller: widget.controller,

          onChanged: widget.onSearch,

          decoration: InputDecoration(

            hintText: "Search order",

            hintStyle: fontTextStyle(

              16,

              const Color(0XFF646566),

              FontWeight.w400,

            ),

            prefixIcon: SizedBox(

              height: 20,

              width: 20,

              child: Padding(

                padding: const EdgeInsets.all(8.0),

                child: Image.asset(

                  'images/search.png',

                  fit: BoxFit.contain,

                ),

              ),

            ),

            /// ⭐ CLEAR BUTTON ADDED HERE
            suffixIcon: widget.controller.text.isNotEmpty

                ? IconButton(

              icon: const Icon(
                  Icons.close,
                  size:18,
                  color: Color(0XFF646566)
              ),

              onPressed: (){

                widget.controller.clear();

              },

            )

                : null,

            border: InputBorder.none,

            contentPadding: const EdgeInsets.symmetric(vertical: 0),

          ),

          style: fontTextStyle(

            16,

            const Color(0XFF2A2A2A),

            FontWeight.w400,

          ),

        ),

      ),

      actions: [

        Padding(

          padding: const EdgeInsets.all(8.0),

          child: GestureDetector(

            onTap: widget.onHelp,

            child: Image.asset(

              'images/help_appbar.png',

              height: 24,

              width: 24,

              fit: BoxFit.contain,

            ),

          ),

        ),

      ],

    );

  }

}