import 'package:flutter/material.dart';
import '../../../core/theme/halo_tokens.dart';

/// One of the three sub-tab buttons across the top of the Chat tab.
///
/// Active state uses the brand color for the label + an underline; an
/// optional `badgeCount` renders the numeric pill next to the label.
/// `null` or `0` hides the pill (per Selesai's no-badge rule).
class SubTabPill extends StatelessWidget {
  final String label;
  final bool active;
  final int? badgeCount;
  final VoidCallback onTap;

  const SubTabPill({
    super.key,
    required this.label,
    required this.active,
    required this.onTap,
    this.badgeCount,
  });

  @override
  Widget build(BuildContext context) {
    final color = active ? HaloTokens.brandDark : HaloTokens.inkSoft;
    final showBadge = badgeCount != null && badgeCount! > 0;
    return Expanded(
      child: InkWell(
        onTap: onTap,
        child: Container(
          padding: const EdgeInsets.symmetric(vertical: 14, horizontal: 4),
          decoration: BoxDecoration(
            border: Border(
              bottom: BorderSide(
                color: active ? HaloTokens.brand : Colors.transparent,
                width: 2,
              ),
            ),
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            mainAxisSize: MainAxisSize.min,
            children: [
              Text(
                label,
                style: TextStyle(
                  fontFamily: HaloTokens.fontBody,
                  fontSize: 13,
                  fontWeight: active ? FontWeight.w700 : FontWeight.w500,
                  color: color,
                ),
              ),
              if (showBadge) ...[
                const SizedBox(width: 6),
                _CountBadge(count: badgeCount!, active: active),
              ],
            ],
          ),
        ),
      ),
    );
  }
}

class _CountBadge extends StatelessWidget {
  final int count;
  final bool active;
  const _CountBadge({required this.count, required this.active});

  @override
  Widget build(BuildContext context) {
    return Container(
      constraints: const BoxConstraints(minWidth: 18),
      height: 18,
      padding: const EdgeInsets.symmetric(horizontal: 6),
      alignment: Alignment.center,
      decoration: BoxDecoration(
        color: active ? HaloTokens.brand : HaloTokens.brandSoft,
        borderRadius: BorderRadius.circular(9),
      ),
      child: Text(
        '$count',
        style: TextStyle(
          fontFamily: HaloTokens.fontBody,
          fontSize: 10,
          fontWeight: FontWeight.w700,
          color: active ? Colors.white : HaloTokens.brandDark,
        ),
      ),
    );
  }
}
