import 'package:flutter/material.dart';
import 'package:lottie/lottie.dart';
import 'package:mohem_flutter_app/models/get_notifications_response_model.dart';
import 'package:mohem_flutter_app/widgets/app_bar_widget.dart';

class NotificationsDetailsPage extends StatefulWidget {
  final GetNotificationsResponseModel notification;

  NotificationsDetailsPage({required this.notification});

  @override
  State<NotificationsDetailsPage> createState() => _NotificationsDetailsPageState();
}

class _NotificationsDetailsPageState extends State<NotificationsDetailsPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBarWidget(
        context,
        title: "Notification Details",
      ),
      body: ListView(
        physics: BouncingScrollPhysics(),
        padding: EdgeInsets.all(21),
        children: [
          Text(
            widget.notification.createdOn!,
            style: const TextStyle(
              fontSize: 16,
              fontWeight: FontWeight.w600,
              color: Color(0xff2E303A),
              letterSpacing: -0.64,
            ),
          ),
          if (widget.notification.messageTypeData != null)
            if (widget.notification.messageTypeData!.isNotEmpty && widget.notification.notificationType != "2")
              Padding(
                padding: const EdgeInsets.only(top: 18),
                child: Image.network(widget.notification.messageTypeData!, loadingBuilder: (BuildContext context, Widget child, ImageChunkEvent? loadingProgress) {
                  if (loadingProgress == null) return child;
                  return Center(
                    child: SizedBox(
                      width: 40.0,
                      height: 40.0,
                      child: showLoadingAnimation(),
                    ),
                  );
                }, fit: BoxFit.fill),
              ),
          SizedBox(height: 18),
          Text(
            widget.notification.message!.trim(),
            style: const TextStyle(
              fontSize: 12,
              fontWeight: FontWeight.w600,
              color: Color(0xff575757),
              letterSpacing: -0.48,
            ),
          ),
        ],
      ),
    );
  }

  Widget showLoadingAnimation() {
    return Lottie.asset(
      'assets/lottie/loading.json',
      repeat: true,
      reverse: false,
    );
  }
}