import 'package:chat/configs/app_colors.dart';
import 'package:chat/configs/emoji.dart';
import 'package:chat/models/im/emoji_model.dart';
import 'package:flutter/material.dart';

class EmojiPanel extends StatelessWidget {
  final void Function(int unicode) onTapEmoji;

  const EmojiPanel({
    Key? key,
    required this.onTapEmoji,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Column(
        children: [
          Container(
            height: 248,
            color: AppColors.page,
            child: Stack(
              children: [
                GridView(
                  gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                    crossAxisCount: 8,
                    childAspectRatio: 1,
                  ),
                  children: emojiData.map(
                    (e) {
                      var item = EmojiModel.fromJson(e);
                      return InkWell(
                        onTap: () {
                          onTapEmoji(item.unicode);
                        },
                        child: Center(
                          child: EmojiItem(
                            name: item.name,
                            unicode: item.unicode,
                          ),
                        ),
                      );
                    },
                  ).toList(),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

class EmojiItem extends StatelessWidget {
  const EmojiItem({Key? key, required this.name, required this.unicode})
      : super(key: key);
  final String name;
  final int unicode;
  @override
  Widget build(BuildContext context) {
    return Text(
      String.fromCharCode(unicode),
      style: const TextStyle(
        fontSize: 26,
      ),
    );
  }
}