import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/extension/build_context_x.dart';

class DraggableCard extends StatelessWidget {
  const DraggableCard({
    super.key,
    required this.imagePath,
    required this.title,
    this.titleColor,
  });

  final String imagePath;
  final String title;
  final Color? titleColor;

  @override
  Widget build(BuildContext context) {
    return Card(
      color: ColorsManager.whiteColors,
      child: SizedBox(
        height: 123,
        width: 90,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Container(
              height: 50,
              width: 50,
              decoration: BoxDecoration(
                color: ColorsManager.CircleImageBackground,
                borderRadius: BorderRadius.circular(90),
                border: Border.all(
                  color: ColorsManager.graysColor,
                ),
              ),
              padding: const EdgeInsets.all(8),
              child: imagePath.contains('.svg')
                  ? SvgPicture.asset(
                      imagePath,
                    )
                  : Image.network(imagePath),
            ),
            const SizedBox(
              height: 8,
            ),
            Text(
              title,
              textAlign: TextAlign.center,
              overflow: TextOverflow.ellipsis,
              maxLines: 2,
              style: context.textTheme.bodySmall?.copyWith(
                color: titleColor ?? ColorsManager.blackColor,
              ),
            ),
          ],
        ),
      ),
    );
  }
}