notas/lib/widgets/search_app_bar.dart

import 'dart:async';

import 'package:flutter/material.dart';

import 'package:notas/theme/app_palette.dart';

class SearchAppBar extends StatefulWidget {
  const SearchAppBar({
    super.key,
    this.controller,
    this.onMenuPressed,
    this.onLeadingPressed,
    this.leadingIcon = Icons.menu,
    this.leadingTooltip = 'Menú',
    this.leadingWidget,
    this.showLeadingButton = true,
    this.trailingWidget,
    this.onSearchChanged,
    this.searchHint = 'Buscar notas...',
    this.searchMaxWidth = 600,
    this.searchDebounceDuration = const Duration(milliseconds: 300),
    this.padding = const EdgeInsets.only(left: 8, right: 20, top: 7, bottom: 7),
    this.showSearch = true,
    this.titleText,
  });

  final TextEditingController? controller;
  final VoidCallback? onMenuPressed;
  final VoidCallback? onLeadingPressed;
  final IconData leadingIcon;
  final String leadingTooltip;
  final Widget? leadingWidget;
  final bool showLeadingButton;
  final Widget? trailingWidget;
  final ValueChanged<String>? onSearchChanged;
  final String searchHint;
  final double searchMaxWidth;
  final Duration searchDebounceDuration;
  final EdgeInsetsGeometry padding;
  final bool showSearch;
  final String? titleText;

  @override
  State<SearchAppBar> createState() => _SearchAppBarState();
}

class _SearchAppBarState extends State<SearchAppBar> {
  late final TextEditingController _searchController;
  late final bool _ownsController;
  Timer? _debounceTimer;

  void _refreshState() {
    setState(() {});
  }

  void _handleSearchInput(String value) {
    _refreshState();

    if (widget.onSearchChanged == null) {
      return;
    }

    _debounceTimer?.cancel();
    _debounceTimer = Timer(widget.searchDebounceDuration, () {
      if (!mounted) {
        return;
      }

      widget.onSearchChanged?.call(value.trim());
    });
  }

  @override
  void initState() {
    super.initState();
    _searchController = widget.controller ?? TextEditingController();
    _ownsController = widget.controller == null;
    _searchController.addListener(_refreshState);
  }

  @override
  void dispose() {
    _debounceTimer?.cancel();
    _searchController.removeListener(_refreshState);
    if (_ownsController) {
      _searchController.dispose();
    }
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    final AppPalette palette = Theme.of(context).extension<AppPalette>()!;
    final Widget? leadingControl = widget.leadingWidget ??
        (widget.showLeadingButton
            ? IconButton(
                onPressed: widget.onLeadingPressed ?? widget.onMenuPressed,
                icon: Icon(
                  widget.leadingIcon,
                  color: palette.textSecondary,
                  size: 20,
                ),
                tooltip: widget.leadingTooltip,
                splashRadius: 18,
                constraints: const BoxConstraints(minWidth: 40, minHeight: 40),
              )
            : null);

    return Container(
      decoration: BoxDecoration(
        color: palette.transparent,
        border: Border(bottom: BorderSide(color: palette.border, width: 0.5)),
      ),
      padding: widget.padding,
      child: Row(
        children: [
          if (leadingControl != null) ...[
            leadingControl,
            const SizedBox(width: 8),
          ],
          Expanded(
            child: widget.showSearch
                ? Center(
                    child: ConstrainedBox(
                      constraints: BoxConstraints(maxWidth: widget.searchMaxWidth),
                      child: TextField(
                        controller: _searchController,
                        onChanged: _handleSearchInput,
                        style: TextStyle(
                          color: palette.textPrimary,
                          fontSize: 13,
                        ),
                        cursorColor: palette.textSecondary,
                        decoration: InputDecoration(
                          hintText: widget.searchHint,
                          hintStyle: TextStyle(
                            color: palette.textSecondary.withValues(alpha: 0.6),
                          ),
                          suffixIcon: _searchController.text.isNotEmpty
                              ? IconButton(
                                  icon: Icon(
                                    Icons.clear,
                                    color: palette.textSecondary,
                                    size: 18,
                                  ),
                                  onPressed: () {
                                    _debounceTimer?.cancel();
                                    _searchController.clear();
                                    widget.onSearchChanged?.call('');
                                  },
                                  constraints: const BoxConstraints(
                                    minWidth: 36,
                                    minHeight: 36,
                                  ),
                                )
                              : Padding(
                                  padding: const EdgeInsets.only(right: 8),
                                  child: Icon(
                                    Icons.search,
                                    color: palette.textSecondary,
                                    size: 18,
                                  ),
                                ),
                          border: OutlineInputBorder(
                            borderRadius: BorderRadius.circular(8),
                            borderSide: BorderSide(
                              color: palette.border,
                              width: 0.5,
                            ),
                          ),
                          enabledBorder: OutlineInputBorder(
                            borderRadius: BorderRadius.circular(8),
                            borderSide: BorderSide(
                              color: palette.border,
                              width: 0.5,
                            ),
                          ),
                          focusedBorder: OutlineInputBorder(
                            borderRadius: BorderRadius.circular(8),
                            borderSide: BorderSide(
                              color: palette.accent,
                              width: 0.6,
                            ),
                          ),
                          filled: true,
                          fillColor: palette.fill,
                          contentPadding: const EdgeInsets.symmetric(
                            horizontal: 12,
                            vertical: 8,
                          ),
                          isDense: true,
                        ),
                      ),
                    ),
                  )
                : Align(
                    alignment: Alignment.centerLeft,
                    child: Text(
                      widget.titleText ?? '',
                      style: TextStyle(
                        color: palette.textPrimary,
                        fontSize: 18,
                        fontWeight: FontWeight.w600,
                      ),
                    ),
                  ),
          ),
          if (widget.trailingWidget != null) ...[
            const SizedBox(width: 16),
            Center(child: widget.trailingWidget!),
          ],
        ],
      ),
    );
  }
}