import 'package:flutter/material.dart';

import '../../../../core/theme/app_theme.dart';

/// شیتِ «بسته چت»: شکلک‌ها و پیام‌های آماده. با انتخابِ هر مورد، بسته می‌شود و
/// همان لحظه برای همه‌ی میز پخش می‌شود (نمایش کنارِ آواتارِ فرستنده).
class ChatSheet extends StatelessWidget {
  final void Function(String text) onText;
  final void Function(String emoji) onEmoji;
  const ChatSheet({super.key, required this.onText, required this.onEmoji});

  static const _emojis = [
    '😀', '😂', '🤣', '😎', '😍', '😡', '😭', '👏',
    '👍', '🔥', '💪', '🎉', '❤️', '🤔', '🙏', '😴',
  ];

  static const _phrases = [
    'سلام', 'خسته نباشید', 'آفرین!', 'چه حرکتی!',
    'کارت تمومه', 'حواست کجاست؟', 'عجب شانسی!', 'دمت گرم',
    'بریم بعدی', 'ساکت!', 'خیلی عقبید', 'برادرمی',
    'کُت نشین!', 'حاکم فقط خودم', 'یاد گرفتی؟', 'رحم کن',
  ];

  static Future<void> show(
    BuildContext context, {
    required void Function(String text) onText,
    required void Function(String emoji) onEmoji,
  }) {
    return showModalBottomSheet(
      context: context,
      backgroundColor: Colors.transparent,
      builder: (_) => ChatSheet(onText: onText, onEmoji: onEmoji),
    );
  }

  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 2,
      child: Container(
        decoration: const BoxDecoration(
          gradient: LinearGradient(
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter,
            colors: [Color(0xFF6A0D1A), AppColors.bgDark],
          ),
          borderRadius: BorderRadius.vertical(top: Radius.circular(20)),
          border: Border(top: BorderSide(color: AppColors.gold, width: 2)),
        ),
        padding: const EdgeInsets.only(bottom: 12),
        child: SafeArea(
          top: false,
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [
              const SizedBox(height: 8),
              const Text('بسته چت',
                  style: TextStyle(
                      color: AppColors.gold,
                      fontSize: 18,
                      fontWeight: FontWeight.bold)),
              const TabBar(
                indicatorColor: AppColors.gold,
                labelColor: AppColors.gold,
                unselectedLabelColor: Colors.white54,
                tabs: [Tab(text: 'شکلک'), Tab(text: 'پیام‌ها')],
              ),
              SizedBox(
                height: 240,
                child: TabBarView(
                  children: [
                    _emojiGrid(context),
                    _phraseList(context),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }

  Widget _emojiGrid(BuildContext context) => GridView.count(
        crossAxisCount: 5,
        padding: const EdgeInsets.all(12),
        children: [
          for (final e in _emojis)
            InkWell(
              borderRadius: BorderRadius.circular(12),
              onTap: () {
                onEmoji(e);
                Navigator.pop(context);
              },
              child: Center(child: Text(e, style: const TextStyle(fontSize: 34))),
            ),
        ],
      );

  Widget _phraseList(BuildContext context) => GridView.count(
        crossAxisCount: 2,
        padding: const EdgeInsets.all(12),
        childAspectRatio: 3.2,
        mainAxisSpacing: 8,
        crossAxisSpacing: 8,
        children: [
          for (final p in _phrases)
            GestureDetector(
              onTap: () {
                onText(p);
                Navigator.pop(context);
              },
              child: Container(
                alignment: Alignment.center,
                padding: const EdgeInsets.symmetric(horizontal: 8),
                decoration: BoxDecoration(
                  gradient: const LinearGradient(
                    begin: Alignment.topCenter,
                    end: Alignment.bottomCenter,
                    colors: [Color(0xFF8E1620), Color(0xFF5A0E14)],
                  ),
                  borderRadius: BorderRadius.circular(10),
                  border: Border.all(color: AppColors.goldDark, width: 1.2),
                ),
                child: Text(
                  p,
                  maxLines: 1,
                  overflow: TextOverflow.ellipsis,
                  style: const TextStyle(
                      color: Colors.white, fontWeight: FontWeight.bold),
                ),
              ),
            ),
        ],
      );
}