import 'package:flutter/material.dart';

import '../models/message.dart';
import '../services/chat/chat_service.dart';
import '../utils/helper.dart';

class UserTileChats extends StatelessWidget {
  final String headerText;
  final String? currentUserId;
  final String? otherUserId;
  final String? profileImageUrl;
  final void Function()? onTap;

  const UserTileChats({
    super.key,
    required this.headerText,
    this.currentUserId,
    this.otherUserId,
    this.profileImageUrl,
    required this.onTap,
  });

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onTap,
      child: Container(
        decoration: BoxDecoration(
          color: Theme.of(context).colorScheme.secondary,
          borderRadius: BorderRadius.circular(12),
        ),
        margin: const EdgeInsets.symmetric(vertical: 5, horizontal: 25),
        padding: const EdgeInsets.all(10),
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            buildProfileIcon(),
            buildMsgContent(),
          ],
        ),
      ),
    );
  }

  Widget buildProfileIcon() {
    return Row(
      children: [
        // Profile image
        if (profileImageUrl != null && profileImageUrl!.isNotEmpty)
          CircleAvatar(
            backgroundImage: NetworkImage(profileImageUrl!),
            radius: 24,
          ),
        // Icon if profile image is not set
        if (profileImageUrl == null || profileImageUrl!.isEmpty)
          const Icon(Icons.person),

        const SizedBox(width: 12),
      ],
    );
  }

  Widget buildMsgContent() {
    String msgDateString = '';
    String msgContent = '';
    bool? outgoing;
    String chatRoomID = getCompoundId([currentUserId ?? '', otherUserId ?? '']);

    return FutureBuilder<Message?>(
      future: ChatService().getLastMessage(chatRoomID),
      builder: (context, snapshot) {
        if (snapshot.connectionState == ConnectionState.waiting) {
          return const CircularProgressIndicator();
        } else if (snapshot.hasError) {
          return Expanded(
            child: Text(
              'Error <last message>: ${snapshot.error}',
              style: const TextStyle(color: Colors.red),
            ),
          );
        } else if (!snapshot.hasData || snapshot.data == null) {
          return buildMsgDetails('No messages yet', '', null);
        } else {
          Message lastMessage = snapshot.data!;
          msgDateString = formatTimestamp(lastMessage.timestamp);

          if (lastMessage.senderID == currentUserId) {
            msgContent = 'Me: ${lastMessage.message}';
            outgoing = true;
          } else if (lastMessage.senderID == otherUserId) {
            msgContent = lastMessage.message;
            outgoing = false;
          }

          return buildMsgDetails(msgContent, msgDateString, outgoing);
        }
      },
    );
  }

  Widget buildMsgDetails(
      String msgContent, String msgDateString, bool? outgoing) {
    return Expanded(
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
          // user name
          Text(
            headerText,
            style: const TextStyle(
              fontSize: 20,
              fontWeight: FontWeight.w500,
            ),
          ),
          const SizedBox(height: 4),
          Text(msgContent, overflow: TextOverflow.ellipsis, maxLines: 1),
          Row(
            children: [
              if (outgoing == true)
                const Icon(
                  Icons.call_made,
                  color: Colors.green,
                  size: 16,
                ),
              if (outgoing == false)
                const Icon(
                  Icons.call_received,
                  color: Colors.blue,
                  size: 16,
                ),
              const SizedBox(width: 4),
              if (msgDateString.isNotEmpty)
                Flexible(
                  child: Text(
                    msgDateString,
                    overflow: TextOverflow.ellipsis,
                    maxLines: 1,
                  ),
                ),
            ],
          ),
        ],
      ),
    );
  }
}