import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:prosappco/blocs/my_user_bloc/my_user_bloc.dart';
import 'package:prosappco/blocs/professional_bloc/professional_bloc.dart';
import 'package:prosappco/screens/professional/professional_profile_screen.dart';
import 'package:prosappco/screens/profile/profile_screen.dart';

class GeneralDrawerHeader extends StatelessWidget {
  const GeneralDrawerHeader({super.key});

  @override
  Widget build(BuildContext context) {
    return BlocBuilder<MyUserBloc, MyUserState>(
      builder: (context, userState) {
        if (userState.status == MyUserStatus.success) {
          final user = userState.user!;
          return BlocBuilder<ProfessionalBloc, ProfessionalState>(
            builder: (context, proState) {
              final isProMode = (proState is LoadedModeProState) &&
                  proState.isProModeActive;
              return InkWell(
                onTap: () {
                  isProMode
                      ? Navigator.push(
                          context,
                          CupertinoPageRoute(
                            builder: (_) => const ProfessionalProfileScreen(),
                          ),
                        )
                      : Navigator.push(
                          context,
                          CupertinoPageRoute(
                            builder: (_) => const ProfileScreen(),
                          ),
                        );
                },
                child: Padding(
                  padding: EdgeInsets.fromLTRB(
                      20,
                      MediaQuery.of(context).padding.top + 20,
                      20,
                      16),
                  child: Row(
                    children: [
                      _avatar(user.picture),
                      const SizedBox(width: 14),
                      Expanded(
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Text(
                              user.name ?? '',
                              overflow: TextOverflow.ellipsis,
                              style: TextStyle(
                                fontSize: 15,
                                fontWeight: FontWeight.w700,
                                color: Theme.of(context).colorScheme.onSurface,
                              ),
                            ),
                            const SizedBox(height: 5),
                            _modePill(isProMode),
                          ],
                        ),
                      ),
                      Icon(
                        Icons.keyboard_arrow_right,
                        color: Theme.of(context)
                            .colorScheme
                            .onSurface
                            .withOpacity(0.4),
                      ),
                    ],
                  ),
                ),
              );
            },
          );
        } else if (userState.status == MyUserStatus.failure) {
          return const Padding(
            padding: EdgeInsets.all(16),
            child: Text('Error obteniendo datos del usuario'),
          );
        } else {
          return const Padding(
            padding: EdgeInsets.all(24),
            child: CircularProgressIndicator(),
          );
        }
      },
    );
  }

  Widget _modePill(bool isProMode) {
    final color =
        isProMode ? const Color(0xFF0D9488) : const Color(0xFF1565C0);
    final icon = isProMode ? Icons.badge_outlined : Icons.person_outline;
    final label = isProMode ? 'Profesional' : 'Cliente';

    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 3),
      decoration: BoxDecoration(
        color: color,
        borderRadius: BorderRadius.circular(20),
      ),
      child: Row(
        mainAxisSize: MainAxisSize.min,
        children: [
          Icon(icon, color: Colors.white, size: 12),
          const SizedBox(width: 4),
          Text(
            label,
            style: const TextStyle(
              fontSize: 11,
              color: Colors.white,
              fontWeight: FontWeight.w600,
            ),
          ),
        ],
      ),
    );
  }

  Widget _avatar(String? pictureUrl) {
    ImageProvider<Object>? imageProvider;
    if (pictureUrl != null && pictureUrl.isNotEmpty) {
      imageProvider = NetworkImage(pictureUrl);
    }

    return Hero(
      tag: 'picture-profile',
      child: Container(
        width: 52,
        height: 52,
        decoration: BoxDecoration(
          color: Colors.grey.shade300,
          shape: BoxShape.circle,
          border: Border.all(color: const Color(0xFF1565C0).withOpacity(0.3), width: 2),
          image: imageProvider == null
              ? null
              : DecorationImage(image: imageProvider, fit: BoxFit.cover),
        ),
        child: imageProvider == null
            ? Icon(CupertinoIcons.person,
                color: Colors.grey.shade500, size: 28)
            : null,
      ),
    );
  }
}