import 'package:flutter/material.dart';
import 'package:gap/gap.dart';
import 'package:krow/core/data/models/event/business_member_model.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';

class EventCompletedByCardWidget extends StatelessWidget {
  final BusinessMemberModel? completedBy;
  final String? completedNote;

  const EventCompletedByCardWidget(
      {super.key, required this.completedBy, required this.completedNote});

  @override
  Widget build(BuildContext context) {
    if (completedBy == null) return Container();
    return Container(
      decoration: KwBoxDecorations.white12,
      padding: const EdgeInsets.all(12),
      margin: const EdgeInsets.only(top: 16),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            'Completed by',
            style:
                AppTextStyles.bodySmallReg.copyWith(color: AppColors.blackGray),
          ),
          const Gap(4),
          _contact(),
          const Gap(12),
          Text(
            'Note',
            style:
                AppTextStyles.bodySmallReg.copyWith(color: AppColors.blackGray),
          ),
          const Gap(2),
          Column(
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: [
              Text(
                completedNote ?? '',
                style: AppTextStyles.bodyMediumMed,
              ),
            ],
          )
        ],
      ),
    );
  }

  Container _contact() {
    return Container(
      height: 28,
      padding: const EdgeInsets.only(left: 2, right: 12, top: 2, bottom: 2),
      decoration: BoxDecoration(
        color: AppColors.tintBlue,
        borderRadius: BorderRadius.circular(14),
      ),
      child: Row(
        mainAxisSize: MainAxisSize.min,
        children: [
          Container(
              height: 24,
              width: 24,
              decoration: BoxDecoration(
                color: AppColors.blackGray,
                borderRadius: BorderRadius.circular(12),
              )),
          const Gap(8),
          Text(
            '${completedBy?.firstName} ${completedBy?.lastName}',
            style: AppTextStyles.bodyMediumMed,
          ),
        ],
      ),
    );
  }
}
