import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';

/// A circular icon button used in the header section.
///
/// Supports an optional badge for notification counts and an active state
/// for toggled actions.
class HeaderIconButton extends StatelessWidget {
  /// The icon to display.
  final IconData icon;

  /// Optional badge text (e.g., notification count).
  final String? badgeText;

  /// Whether this button is in an active/selected state.
  final bool isActive;

  /// Callback invoked when the button is tapped.
  final VoidCallback onTap;

  /// Creates a [HeaderIconButton].
  const HeaderIconButton({
    required this.icon,
    this.badgeText,
    this.isActive = false,
    required this.onTap,
    super.key,
  });

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onTap,
      child: Stack(
        clipBehavior: Clip.none,
        children: <Widget>[
          Container(
            width: 32,
            height: 32,
            decoration: BoxDecoration(
              color: isActive ? UiColors.primary : UiColors.white,
              borderRadius: UiConstants.radiusMd,
              boxShadow: <BoxShadow>[
                BoxShadow(
                  color: Colors.black.withValues(alpha: 0.05),
                  blurRadius: 2,
                ),
              ],
            ),
            child: Icon(
              icon,
              color: isActive ? UiColors.white : UiColors.iconSecondary,
              size: 16,
            ),
          ),
          if (badgeText != null)
            Positioned(
              top: -4,
              right: -4,
              child: Container(
                padding: const EdgeInsets.all(4),
                decoration: const BoxDecoration(
                  color: UiColors.iconError,
                  shape: BoxShape.circle,
                ),
                constraints: const BoxConstraints(minWidth: 16, minHeight: 16),
                child: Center(
                  child: Text(
                    badgeText!,
                    style: UiTypography.footnote2b.copyWith(
                      color: UiColors.white,
                      fontSize: 8,
                    ),
                  ),
                ),
              ),
            ),
        ],
      ),
    );
  }
}
