import 'package:cheminova/controller/notification_controller.dart';
import 'package:cheminova/models/notification_model.dart';
import 'package:cheminova/widgets/my_drawer.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:get/get.dart';
import 'package:intl/intl.dart';

import '../../widgets/comman_background.dart';
import '../../widgets/common_appbar.dart';

class NotificationScreen extends StatelessWidget {
  NotificationScreen({super.key});

  // Initialize the controller
  final NotificationController notificationController = Get.put(NotificationController());

  @override
  Widget build(BuildContext context) {
    // Fetch notifications when the screen is first built
    notificationController.fetchNotificationApiService();

    return CommonBackground(
      child: Scaffold(
        backgroundColor: Colors.transparent,
        appBar: CommonAppBar(
          actions: [
            IconButton(
              onPressed: () {
                Navigator.pop(context);
              },
              icon: SvgPicture.asset('assets/svg/back_arrow.svg'),
              padding: const EdgeInsets.only(right: 20),
            ),
          ],
          title: const Text('Notification',
              style: TextStyle(
                  fontSize: 20,
                  color: Colors.black,
                  fontWeight: FontWeight.w400,
                  fontFamily: 'Anek')),
          backgroundColor: Colors.transparent,
          elevation: 0,
        ),
        drawer: MyDrawer(),
        body: Obx(() {
          // Show a loading indicator while data is being fetched
          if (notificationController.isLoading.value) {
            return const Center(child: CircularProgressIndicator());
          } else if (notificationController.notificationList.isEmpty) {
            // Handle empty state
            return const Center(child: Text("No notifications available"));
          } else {
            // Show the notification list once data is fetched
            return MyListView(notificationList: notificationController.notificationList);
          }
        }),
      ),
    );
  }
}

class MyListView extends StatelessWidget {
  final List<NotificationModel> notificationList;

  const MyListView({super.key, required this.notificationList});

  @override
  Widget build(BuildContext context) {
    // Group notifications by date
    Map<String, List<NotificationModel>> groupedNotifications = {};

    for (var notification in notificationList) {
      // Ensure that 'notifications' is not null
      if (notification != null) {
        String date = DateFormat("dd MMM yyyy")
            .format(DateTime.parse(notification.createdAt ?? ''));
        if (!groupedNotifications.containsKey(date)) {
          groupedNotifications[date] = [];
        }
        groupedNotifications[date]!.add(notification);
      }
    }

    return ListView.builder(
      padding: const EdgeInsets.only(top: 15),
      itemCount: groupedNotifications.length,
      itemBuilder: (context, index) {
        String date = groupedNotifications.keys.elementAt(index);
        List<NotificationModel> notificationsForDate = groupedNotifications[date]!;

        return Padding(
          padding: const EdgeInsets.only(bottom: 10, left: 10, right: 10),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              // Display the date once
              Padding(
                padding: const EdgeInsets.only(bottom: 8.0),
                child: Text(
                  date,
                  style: const TextStyle(
                      fontSize: 16, fontWeight: FontWeight.bold),
                ),
              ),
              // Display notifications for the date
              ...notificationsForDate.map(
                    (notification) {
                  return Padding(
                    padding: const EdgeInsets.only(bottom: 10),
                    child: ExpansionTile(
                      collapsedBackgroundColor: Colors.white,
                      backgroundColor: Colors.white,
                      trailing: const SizedBox.shrink(),
                      title: Text(
                        notification.title ?? 'No title',
                        style: const TextStyle(
                            fontSize: 17, fontWeight: FontWeight.w500),
                      ),
                      subtitle: Text(notification.msg ?? 'No message'),
                    ),
                  );
                },
              ).toList(),
            ],
          ),
        );
      },
    );
  }
}
