import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:test_sa/controllers/notification/firebase_notification_manger.dart';
import 'package:test_sa/controllers/notification/notification_manger.dart';
import 'package:test_sa/controllers/providers/api/all_requests_provider.dart';
import 'package:test_sa/controllers/providers/api/notifications_provider.dart';
import 'package:test_sa/controllers/providers/api/user_provider.dart';
import 'package:test_sa/controllers/providers/settings/setting_provider.dart';
import 'package:test_sa/extensions/context_extension.dart';
import 'package:test_sa/extensions/int_extensions.dart';
import 'package:test_sa/extensions/text_extensions.dart';
import 'package:test_sa/extensions/widget_extensions.dart';
import 'package:test_sa/models/user.dart';
import 'package:test_sa/new_views/app_style/app_color.dart';
import 'package:test_sa/new_views/pages/land_page/dashboard_fragments/progress_fragment.dart';
import 'package:test_sa/new_views/pages/land_page/dashboard_fragments/recent_activites_fragment.dart';
import 'package:test_sa/new_views/pages/land_page/dashboard_fragments/requests_fragment.dart';
import 'package:test_sa/views/pages/user/notifications/notifications_page.dart';

class DashboardPage extends StatefulWidget {
  final VoidCallback onDrawerPress;

  const DashboardPage({Key? key,required this.onDrawerPress}) : super(key: key);

  @override
  State<DashboardPage> createState() => _DashboardPageState();
}

class _DashboardPageState extends State<DashboardPage> {
  int _currentPage = 0;

  @override
  void initState() {
    super.initState();
    getAllRequests();
  }

  void getAllRequests() {
    WidgetsBinding.instance.addPostFrameCallback((_) {
      Provider.of<AllRequestsProvider>(context, listen: false).getRequests();
      Provider.of<NotificationsProvider>(context, listen: false).getSystemNotifications(user: Provider.of<UserProvider>(context, listen: false).user!, resetProvider: true);
    });
  }

  @override
  void dispose() {
    super.dispose();
  }

  bool isFCM = true;

  @override
  Widget build(BuildContext context) {
    if (isFCM) {
      FirebaseNotificationManger.initialized(context);
      NotificationManger.initialisation((notificationDetails) {
        FirebaseNotificationManger.handleMessage(context, json.decode(notificationDetails.payload!));
      }, (id, title, body, payload) async {});

      isFCM = false;
    }
    final User user = Provider.of<UserProvider>(context, listen: false).user!;
    final setting = Provider.of<SettingProvider>(context, listen: false);
    return Scaffold(
      appBar: AppBar(
        automaticallyImplyLeading: false,
        backgroundColor: Theme.of(context).scaffoldBackgroundColor,
        titleSpacing: 0,
        title: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Consumer<UserProvider>(builder: (context, snapshot, _) {
              return CircleAvatar(
                radius: 24,
                backgroundColor: context.isDark ? AppColor.neutral50 : AppColor.neutral40,
                child: Padding(
                  padding: const EdgeInsets.all(1), // Border radius
                  child: ClipOval(
                    child: snapshot.profileImage != null
                        ? Image.file(snapshot.profileImage!)
                        : (snapshot.user?.profilePhotoName?.isNotEmpty ?? false)
                            ? Image.network(snapshot.user!.profilePhotoName!)
                            : const Icon(Icons.person, size: 24, color: Colors.white),
                  ),
                ),
              );
            }).onPress(widget.onDrawerPress),
            const Spacer(),
            Container(
              padding: const EdgeInsets.fromLTRB(12, 6, 6, 6),
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(8),
                color: AppColor.background(context),
                boxShadow: const [
                  BoxShadow(
                    color: Color(0x07000000),
                    blurRadius: 14,
                    offset: Offset(0, 0),
                    spreadRadius: 0,
                  )
                ],
              ),
              child: DropdownButton<AssetGroup>(
                value: setting.assetGroup,
                //iconSize: 24,
                isDense: true,
                icon: const Icon(Icons.keyboard_arrow_down),
                elevation: 8,
                // dropdownColor: Colors.amber,
                borderRadius: BorderRadius.circular(8),
                style: TextStyle(color: Theme.of(context).primaryColor),
                underline: const SizedBox.shrink(),
                onChanged: (newValue) {
                  if (setting.assetGroup != newValue) {
                    Provider.of<SettingProvider>(context, listen: false).setAssetGroup(newValue);
                    setState(() {});
                    getAllRequests();
                  }
                },
                items: user.assetGroups!.map<DropdownMenuItem<AssetGroup>>((value) {
                  return DropdownMenuItem<AssetGroup>(
                    value: value,
                    child: Text(
                      value.name ?? "",
                      style: Theme.of(context).textTheme.bodyLarge,
                    ),
                  );
                }).toList(),
              ),
            ),
            16.width,
            Stack(
              alignment: Alignment.topRight,
              children: [
                Icon(Icons.notifications, color: context.isDark ? AppColor.neutral30 : AppColor.neutral20, size: 30).paddingOnly(top: 6, end: 0),
                // todo @sikander will add count for unread notifications
                // Positioned(
                //   top: 0,
                //   right: 0,
                //   child: Container(
                //     padding: const EdgeInsets.all(4),
                //     decoration: const ShapeDecoration(
                //       color: Color(0xFFD02127),
                //       shape: CircleBorder(),
                //     ),
                //     child: Text("", style: AppTextStyles.bodyText),
                //   ),
                // )
              ],
            ).onPress(() {
              Navigator.of(context).pushNamed(NotificationsPage.id);
            }),
          ],
        ).paddingOnly(start: 16, end: 16),
      ),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisSize: MainAxisSize.min,
            children: [
              Text(
                context.translation.welcome,
                style: AppTextStyles.heading6.copyWith(color: context.isDark ? AppColor.neutral10 : AppColor.neutral20),
              ),
              Text(
                user.username ?? "",
                style: AppTextStyles.heading2.copyWith(color: context.isDark ? AppColor.neutral30 : AppColor.neutral50, fontWeight: FontWeight.w600),
              ),
              24.height,
              Row(
                children: [
                  indicatorView(0),
                  3.width,
                  indicatorView(1),
                  3.width,
                  indicatorView(2),
                  10.width,
                  "0${_currentPage + 1}/03".tinyFont(context).custom(fontWeight: FontWeight.w500, color: context.isDark ? AppColor.neutral30 : AppColor.neutral60),
                ],
              ),
            ],
          ).paddingOnly(start: 16, end: 16, top: 8, bottom: 8),
          PageView(
            onPageChanged: (index) => setState(() => _currentPage = index),
            children: [
              const RequestsFragment(),
              ProgressFragment(),
              const RecentActivitiesFragment(),
            ],
          ).expanded,
        ],
      ),
    );
  }

  Widget indicatorView(int index) {
    bool isActive = _currentPage == index;

    return AnimatedContainer(
      duration: const Duration(milliseconds: 250),
      width: (isActive ? 30 : 12).toScreenWidth,
      height: 9.toScreenHeight,
      decoration: BoxDecoration(
          color: isActive
              ? AppColor.greenStatus(context)
              : context.isDark
                  ? AppColor.neutral20
                  : AppColor.neutral40,
          borderRadius: BorderRadius.circular(8)),
    );
  }
}