import 'package:flutter/material.dart';

import 'package:f0ckapp/models/media_item.dart';

class ActionTag extends StatelessWidget {
  final Tag tag;
  final void Function(String tag) onTagTap;

  const ActionTag(this.tag, this.onTagTap, {super.key});

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () => onTagTap(tag.tag),
      child:
          [
            'german',
            'dutch',
            'ukraine',
            'russia',
            'belgium',
          ].contains(tag.tag)
          ? Stack(
              alignment: Alignment.center,
              children: [
                Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    border: Border.all(color: Colors.white, width: 1),
                  ),
                  child: ClipRRect(
                    borderRadius: BorderRadius.circular(10),
                    child: Image.asset(
                      'assets/images/tags/${tag.tag}.webp',
                      height: 27,
                      width: 60,
                      repeat: ImageRepeat.repeat,
                      fit: BoxFit.fill,
                    ),
                  ),
                ),
                Padding(
                  padding: const EdgeInsets.symmetric(
                    horizontal: 9,
                    vertical: 6,
                  ),
                  child: Text(
                    tag.tag,
                    style: const TextStyle(
                      fontSize: 12,
                      color: Colors.white,
                      fontWeight: FontWeight.w500,
                    ),
                  ),
                ),
              ],
            )
          : Container(
              padding: const EdgeInsets.symmetric(horizontal: 9, vertical: 5),
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(10),
                border: Border.all(color: Colors.white, width: 1),
                color: switch (tag.id) {
                  1 => Colors.green,
                  2 => Colors.red,
                  _ => const Color(0xFF090909),
                },
              ),
              child: Text(
                tag.tag,
                style: const TextStyle(
                  fontSize: 12,
                  color: Colors.white,
                  fontWeight: FontWeight.w500,
                ),
              ),
            ),
    );
  }
}