import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:provider/provider.dart';
import 'package:tm_app/core/constants/assets.dart';
import 'package:tm_app/core/theme/colors.dart';
import 'package:tm_app/core/utils/size_config.dart';
import 'package:tm_app/data/services/model/notification__response/notification_response_model.dart';
import 'package:tm_app/view_models/notification_view_model.dart';

import '../strings/notification_strings.dart';

class NotificationCard extends StatelessWidget {
  final NotificationItem notification;
  const NotificationCard({required this.notification, super.key});

  @override
  Widget build(BuildContext context) {
    final viewModel = context.read<NotificationViewModel>();
    return Container(
      width: double.infinity,
      margin: EdgeInsets.symmetric(horizontal: 24.0.w()),
      padding: const EdgeInsets.all(16.0),
      decoration: BoxDecoration(
        color: AppColors.primary10Light,

        borderRadius: BorderRadius.circular(4),
        border: Border.all(color: AppColors.primary20),
      ),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Padding(
            padding: EdgeInsets.only(top: 3.0.h()),
            child: SvgPicture.asset(AssetsManager.notification),
          ),
          SizedBox(width: 5.0.w()),
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Text(
                      notification.title!,
                      style: TextStyle(
                        fontSize: 16.0.sp(),
                        fontWeight: FontWeight.w600,
                        color: AppColors.grey80,
                      ),
                    ),
                    const Spacer(),
                    Visibility(
                      visible:
                          notification.priority ==
                          NotificationStrings.important.toLowerCase(),
                      child: Container(
                        width: 86.0.w(),
                        height: 24.0.h(),
                        decoration: BoxDecoration(
                          color: AppColors.blue0,
                          borderRadius: BorderRadius.circular(8),
                        ),
                        alignment: Alignment.center,
                        child: Text(
                          NotificationStrings.important,
                          style: TextStyle(
                            fontSize: 12.0.sp(),
                            fontWeight: FontWeight.w500,
                            color: AppColors.cyanTeal,
                          ),
                        ),
                      ),
                    ),
                    SizedBox(width: !notification.seen! ? 8.0.w() : 0),
                    !notification.seen!
                        ? Container(
                          width: 12.0.w(),
                          height: 12.0.w(),
                          decoration: const BoxDecoration(
                            shape: BoxShape.circle,
                            color: AppColors.mainBlue,
                          ),
                        )
                        : const SizedBox(),
                  ],
                ),
                SizedBox(height: 8.0.h()),
                Text(
                  notification.message!,
                  maxLines: 1,
                  overflow: TextOverflow.ellipsis,
                  style: TextStyle(
                    fontSize: 14.0.sp(),
                    fontWeight: FontWeight.w400,
                    color: AppColors.grey70,
                  ),
                ),
                SizedBox(height: 8.0.h()),
                Row(
                  children: [
                    SvgPicture.asset(AssetsManager.calendar),
                    SizedBox(width: 4.0.w()),
                    Text(
                      viewModel.timeAgo(notification.createdAt!.toString()),
                      style: TextStyle(
                        fontSize: 12.0.sp(),
                        fontWeight: FontWeight.w400,
                        color: AppColors.grey60,
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}