import 'package:flutter/material.dart';
import 'package:p_tits_pas/models/m_dashbord/conversation_model.dart';
import 'package:p_tits_pas/models/m_dashbord/notification_model.dart';

class MessagingSidebar extends StatelessWidget {
  final List<ConversationModel> conversations;
  final List<NotificationModel> notifications;
  final bool isCompact;
  final bool isMobile;

  const MessagingSidebar({
    Key? key,
    required this.conversations,
    required this.notifications,
    this.isCompact = false,
    this.isMobile = false,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.all(isMobile ? 16 : 20),
      color: Colors.white,
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          _buildMessagingHeader(),
          const SizedBox(height: 20),
          Expanded(
            child: _buildMessagingContent(),
          ),
          const SizedBox(height: 16),
          _buildContactRPEButton(),
        ],
      ),
    );
  }

  Widget _buildMessagingHeader() {
    return const Text(
      'Messagerie avec Emma Dupont',
      style: TextStyle(
        fontSize: 16,
        fontWeight: FontWeight.w600,
      ),
    );
  }

  Widget _buildMessagingContent() {
    return Column(
      children: [
        // Messages existants
        Expanded(
          child: _buildMessagesList(),
        ),
        const SizedBox(height: 12),
        // Zone de saisie
        _buildMessageInput(),
      ],
    );
  }

  Widget _buildMessagesList() {
    if (conversations.isEmpty) {
      return const Center(
        child: Text(
          'Aucun message',
          style: TextStyle(
            color: Colors.grey,
            fontSize: 14,
          ),
        ),
      );
    }

    // Pour la démo, on affiche quelques messages fictifs
    return ListView(
      children: [
        _buildMessageBubble(
          'Bonjour, Emma a bien dormi aujourd\'hui.',
          isFromCurrentUser: false,
          timestamp: DateTime.now().subtract(const Duration(hours: 2)),
        ),
        const SizedBox(height: 12),
        _buildMessageBubble(
          'Merci pour l\'information. Elle a bien mangé ?',
          isFromCurrentUser: true,
          timestamp: DateTime.now().subtract(const Duration(hours: 1)),
        ),
      ],
    );
  }

  Widget _buildMessageBubble(String content, {required bool isFromCurrentUser, required DateTime timestamp}) {
    return Align(
      alignment: isFromCurrentUser ? Alignment.centerRight : Alignment.centerLeft,
      child: Container(
        constraints: const BoxConstraints(maxWidth: 250),
        padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
        decoration: BoxDecoration(
          color: isFromCurrentUser 
              ? const Color(0xFF9CC5C0)
              : Colors.grey.shade200,
          borderRadius: BorderRadius.circular(16),
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              content,
              style: TextStyle(
                color: isFromCurrentUser ? Colors.white : Colors.black87,
                fontSize: 14,
              ),
            ),
            const SizedBox(height: 4),
            Text(
              _formatTimestamp(timestamp),
              style: TextStyle(
                color: isFromCurrentUser 
                    ? Colors.white.withOpacity(0.8)
                    : Colors.grey.shade600,
                fontSize: 11,
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildMessageInput() {
    return Container(
      padding: const EdgeInsets.all(12),
      decoration: BoxDecoration(
        color: Colors.grey.shade100,
        borderRadius: BorderRadius.circular(20),
      ),
      child: Row(
        children: [
          const Expanded(
            child: TextField(
              decoration: InputDecoration(
                hintText: 'Écrivez votre message...',
                border: InputBorder.none,
                isDense: true,
              ),
              maxLines: null,
            ),
          ),
          const SizedBox(width: 8),
          CircleAvatar(
            radius: 16,
            backgroundColor: const Color(0xFF9CC5C0),
            child: IconButton(
              iconSize: 16,
              padding: EdgeInsets.zero,
              onPressed: () {
                // TODO: Envoyer le message
              },
              icon: const Icon(
                Icons.send,
                color: Colors.white,
              ),
            ),
          ),
        ],
      ),
    );
  }

  Widget _buildContactRPEButton() {
    return SizedBox(
      width: double.infinity,
      child: OutlinedButton(
        onPressed: () {
          // TODO: Contacter le RPE
        },
        style: OutlinedButton.styleFrom(
          padding: const EdgeInsets.symmetric(vertical: 12),
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(8),
          ),
        ),
        child: const Text(
          'Contacter le Relais Petite Enfance',
          textAlign: TextAlign.center,
        ),
      ),
    );
  }

  String _formatTimestamp(DateTime timestamp) {
    final now = DateTime.now();
    final difference = now.difference(timestamp);

    if (difference.inMinutes < 1) {
      return 'À l\'instant';
    } else if (difference.inHours < 1) {
      return '${difference.inMinutes}m';
    } else if (difference.inDays < 1) {
      return '${difference.inHours}h';
    } else {
      return '${timestamp.day}/${timestamp.month}';
    }
  }
}