import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:shadcn_ui/shadcn_ui.dart';
import '../../../core/theme/app_theme.dart';
import '../../../core/theme/app_color_scheme.dart';
import '../../../core/theme/app_spacing.dart';
import '../../../providers/auth_provider.dart';

/// 首頁頂欄 - Logo + 搜索/通知/頭像
class HeaderBar extends StatelessWidget {
  const HeaderBar({super.key});

  @override
  Widget build(BuildContext context) {
    final colorScheme = Theme.of(context).colorScheme;

    return Padding(
      padding: const EdgeInsets.symmetric(
        horizontal: AppSpacing.md,
        vertical: AppSpacing.sm,
      ),
      child: Row(
        children: [
          // Logo
          Text(
            'MONISUO',
            style: AppTextStyles.headlineLarge(context).copyWith(
              fontSize: 18,
              letterSpacing: 1,
            ),
          ),
          const Spacer(),
          // Search button
          _IconButton(
            icon: LucideIcons.search,
            colorScheme: colorScheme,
            onTap: () {},
          ),
          const SizedBox(width: AppSpacing.sm),
          // Bell button
          _IconButton(
            icon: LucideIcons.bell,
            colorScheme: colorScheme,
            onTap: () {},
          ),
          const SizedBox(width: AppSpacing.sm),
          // Avatar
          Consumer<AuthProvider>(
            builder: (context, auth, _) {
              final username = auth.user?.username ?? '';
              final initial = username.isNotEmpty ? username[0].toUpperCase() : '?';
              return Container(
                width: 32,
                height: 32,
                decoration: BoxDecoration(
                  color: colorScheme.primary,
                  shape: BoxShape.circle,
                ),
                alignment: Alignment.center,
                child: Text(
                  initial,
                  style: AppTextStyles.headlineMedium(context).copyWith(
                    color: AppColorScheme.darkOnPrimary,
                  ),
                ),
              );
            },
          ),
        ],
      ),
    );
  }
}

class _IconButton extends StatelessWidget {
  const _IconButton({
    required this.icon,
    required this.colorScheme,
    required this.onTap,
  });

  final IconData icon;
  final ColorScheme colorScheme;
  final VoidCallback onTap;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onTap,
      child: Container(
        width: 32,
        height: 32,
        decoration: BoxDecoration(
          color: colorScheme.surfaceContainerHigh,
          borderRadius: BorderRadius.circular(AppRadius.xl),
        ),
        alignment: Alignment.center,
        child: Icon(
          icon,
          size: 16,
          color: colorScheme.onSurfaceVariant,
        ),
      ),
    );
  }
}