import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import '../controllers/chat_controller.dart';

class ChatMusicCard extends GetView<ChatController> {
  final Map? data;
  final bool isDarkMode;

  const ChatMusicCard(this.data, this.isDarkMode, {super.key});

  @override
  Widget build(BuildContext context) {
    // final Map musiccards = data?['musiccards'].first;
    // final Map musicaudio = data?['musicaudio'];

    return Row(
      children: [
        Container(
          width: 60.w,
          height: 60.w,
          clipBehavior: Clip.hardEdge,
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(6.r),
          ),
          child: Image.network(
            data?['image'],
            fit: BoxFit.cover,
          ),
        ),
        10.horizontalSpace,
        Expanded(
          child: Text(
            data?['name'],
            overflow: TextOverflow.ellipsis,
            style: TextStyle(
              color: isDarkMode ? Colors.white : Colors.black,
              fontSize: 16.sp,
              height: 1.5,
            ),
          ),
        ),
        10.horizontalSpace,
        Obx(
          () => controller.audiourl.value == data?["url"] &&
                  controller.isPlay.value
              ? GestureDetector(
                  onTap: () {
                    controller.pause();
                  },
                  child: Stack(
                    alignment: Alignment.center,
                    children: [
                      Icon(
                        Icons.pause_rounded,
                        color: isDarkMode ? Colors.white : Colors.black,
                      ),
                    ],
                  ),
                )
              : GestureDetector(
                  onTap: () {
                    controller.play(data!);
                  },
                  child: Container(
                    width: 38.w,
                    height: 38.w,
                    decoration: BoxDecoration(
                      color: isDarkMode ? Colors.white : Colors.black,
                      shape: BoxShape.circle,
                    ),
                    child: Icon(
                      Icons.play_arrow_rounded,
                      color: isDarkMode ? Colors.black : Colors.white,
                    ),
                  ),
                ),
        ),
      ],
    );
  }
}