import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:gap/gap.dart';
import 'package:intl/intl.dart';
import 'package:krow/core/application/common/str_extensions.dart';
import 'package:krow/core/application/routing/routes.gr.dart';
import 'package:krow/core/entity/event_entity.dart';
import 'package:krow/core/presentation/gen/assets.gen.dart';
import 'package:krow/core/presentation/styles/kw_box_decorations.dart';
import 'package:krow/core/presentation/styles/kw_text_styles.dart';
import 'package:krow/core/presentation/styles/theme.dart';
import 'package:krow/core/presentation/widgets/icon_row_info_widget.dart';

class EventListItemWidget extends StatelessWidget {
  final EventEntity item;

  const EventListItemWidget({required this.item, super.key});

  Color getIconColor(EventStatus? status) {
    switch (status) {
      case EventStatus.active:
      case EventStatus.finished:
        return AppColors.statusSuccess;
      case EventStatus.pending:
      case EventStatus.assigned:
      case EventStatus.confirmed:
        return AppColors.primaryBlue;
      default:
        return AppColors.statusWarning;
    }
  }

  Color getIconBgColor(EventStatus? status) {
    switch (status) {
      case EventStatus.active:
      case EventStatus.finished:
        return AppColors.tintGreen;
      case EventStatus.pending:
      case EventStatus.assigned:
      case EventStatus.confirmed:
        return AppColors.tintBlue;
      default:
        return AppColors.tintOrange;
    }
  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        context.router.push(EventDetailsRoute(event: item));
      },
      child: Container(
        decoration: KwBoxDecorations.white12,
        padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 24),
        margin: const EdgeInsets.only(bottom: 12, left: 16, right: 16),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            _buildStatusRow(),
            const Gap(12),
            Text(item.name, style: AppTextStyles.headingH1),
            const Gap(4),
            Text('BEO-${item.id}',
                style: AppTextStyles.bodyMediumReg
                    .copyWith(color: AppColors.blackGray)),
            const Gap(12),
            IconRowInfoWidget(
              icon: Assets.images.icons.calendar.svg(),
              title: 'Date',
              value: DateFormat('MM.dd.yyyy')
                  .format(item.startDate ?? DateTime.now()),
            ),
            const Gap(12),
            IconRowInfoWidget(
              icon: Assets.images.icons.location.svg(),
              title: 'Location',
              value: item.hub?.name ?? 'Hub Name',
            ),
            const Gap(24),
            Container(
              height: 34,
              padding: const EdgeInsets.symmetric(horizontal: 12),
              decoration: KwBoxDecorations.primaryLight8.copyWith(),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text('Approximate Total Costs',
                      style: AppTextStyles.bodyMediumReg
                          .copyWith(color: AppColors.blackGray)),
                  ValueListenableBuilder(
                      valueListenable: item.totalCost,
                      builder: (context, value, child) {
                        return Text(
                          '\$${value.toStringAsFixed(2)}',
                          style: AppTextStyles.bodyMediumMed,
                        );
                      })
                ],
              ),
            )
          ],
        ),
      ),
    );
  }

  Row _buildStatusRow() {
    return Row(
      crossAxisAlignment: CrossAxisAlignment.start,
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        Container(
          height: 48,
          width: 48,
          decoration: BoxDecoration(
            color: getIconBgColor(item?.status),
            shape: BoxShape.circle,
          ),
          child: Center(
            child: Assets.images.icons.navigation.confetti.svg(
              colorFilter:
                  ColorFilter.mode(getIconColor(item.status), BlendMode.srcIn),
            ),
          ),
        ),
        Container(
            height: 28,
            padding: const EdgeInsets.symmetric(horizontal: 8),
            decoration: BoxDecoration(
              color: item.status?.color,
              borderRadius: BorderRadius.circular(14),
            ),
            child: Center(
              child: Padding(
                padding: const EdgeInsets.only(bottom: 2.0),
                child: Text(
                  item.status?.name.capitalize() ?? '',
                  style: AppTextStyles.bodySmallMed.copyWith(
                      color: item.status == EventStatus.draft
                          ? null
                          : AppColors.grayWhite),
                ),
              ),
            ))
      ],
    );
  }
}

extension on EventStatus {
  Color get color {
    switch (this) {
      case EventStatus.active:
      case EventStatus.finished:
        return AppColors.statusSuccess;
      case EventStatus.pending:
        return AppColors.blackGray;
      case EventStatus.assigned:
        return AppColors.statusWarning;
      case EventStatus.confirmed:
        return AppColors.primaryBlue;
      case EventStatus.completed:
        return AppColors.statusSuccess;
      case EventStatus.closed:
        return AppColors.bgColorDark;
      case EventStatus.canceled:
        return AppColors.statusError;
      case EventStatus.draft:
        return AppColors.primaryYolk;
    }
  }
}
