import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:frontend/Screens/group/group.dart';
import 'package:go_router/go_router.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:http/http.dart' as http;
import 'package:responsive_builder/responsive_builder.dart';

import '../../config/apiUrl.dart';
import '../../routes/custom_appBar.dart';
import '../../routes/custom_drawer.dart';
import '../../services/apiService.dart';
import '../../utils/auth_utils.dart';
import 'groupDetails.dart';

class GroupListBackUp extends StatefulWidget {
  @override
  _GroupListBackUpState createState() => _GroupListBackUpState();
}

class _GroupListBackUpState extends State<GroupListBackUp> {
  final ApiService apiService = ApiService();

  List<dynamic>? apiAllGroups;
  Color? layoutColor;
  Color? bodyColor;

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

    WidgetsBinding.instance.addPostFrameCallback((_) {
      loadAllGroups();
      loadInitialData();
    });
  }

  void loadInitialData() async {
    String? layoutString = await getLayoutColor();
    String? bodyStringColor = await getBodyColor();

    setState(() {
      layoutColor =
          layoutString != null
              ? Color(int.parse(layoutString))
              : Colors.redAccent;

      bodyColor =
          bodyStringColor != null
              ? Color(int.parse(bodyStringColor))
              : Colors.white;
    });
  }

  Future<void> loadAllGroups() async {
    try {
      final result = await apiService.fetchAllGroup(context);
      setState(() {
        apiAllGroups = result;
      });
      print("Fetched services: $apiAllGroups");
    } catch (e) {
      print('Error fetching role list: $e');
    }
  }

  void handleActiveStatus(
    Map<String, dynamic> groupData,
    String groupId,
    String currentStatus,
  ) async {
    print("Toggling user status - $groupId (Current: $currentStatus)");

    final String apiUrlData =
        '$apiUrl/api/groups/update/$groupId'; // API for updating user
    final String? token = await getToken();

    if (token == null) {
      print("Error: Token not found");
      return;
    }

    // Toggle status: If active ("1"), set to inactive ("0"); otherwise, activate ("1")
    String newStatus = (currentStatus == "1") ? "0" : "1";

    print("STatus 1 - $newStatus");

    try {
      final response = await http.put(
        Uri.parse(apiUrlData),
        headers: {
          'Authorization': 'Bearer $token',
          'Content-Type': 'application/json',
          'app-signature': 'ts-traveltool-2025-signature-123456',
        },
        body: jsonEncode({
          "is_active": newStatus, // Set new status dynamically
        }),
      );

      if (response.statusCode == 200 || response.statusCode == 201) {
        print("User status updated successfully to $newStatus!");
        loadAllGroups(); // Refresh users list after update
      } else {
        print("Failed to update user status. Status: ${response.statusCode}");
        print("Error: ${response.body}");
      }
    } catch (e) {
      print("Error updating user status: $e");
    }
  }

  void deleteGroup(Map<String, dynamic> groupdata, groupId, status) {
    print("GroupId : $groupId");
    print("Groupstatus: $status");
    print("GroupsData: $groupdata");

    // handleActiveStatus(groupdata, groupId, status);
    print("Calling handleActiveStatus with: id=$groupId, status=$status");
    handleActiveStatus(groupdata, groupId.toString(), status.toString());
  }

  Future<void> refreshData() async {
    loadAllGroups();
  }

  // Future<void> deleteGroupFromApi(int groupId) async {
  //   try {
  //     await apiService.deleteGroup(groupId); // your delete API call
  //     deleteGroup(groupId); // remove from UI list
  //   } catch (e) {
  //     print('Error deleting group: $e');
  //   }
  // }'

  @override
  Widget build(BuildContext context) {
    return ResponsiveBuilder(
      builder: (context, sizingInfo) {
        bool isDesktop =
            sizingInfo.deviceScreenType == DeviceScreenType.desktop;

        return Scaffold(
          // backgroundColor: Colors.white,
          backgroundColor: Color(0xFFf5f5f5),
          appBar: CustomAppBar(isDesktop: isDesktop),
          drawer: CustomDrawer(isDesktop: false),
          body: Padding(
            padding:
                isDesktop
                    ? EdgeInsets.symmetric(
                      horizontal:
                          MediaQuery.of(context).size.width *
                          0.1, // 30% of screen width as horizontal padding
                      vertical:
                          MediaQuery.of(context).size.height *
                          0, // 5% of screen height as vertical padding
                    )
                    : EdgeInsets.all(8),
            child: Row(
              children: [
                // if (isDesktop) CustomDrawer(isDesktop: true),
                Expanded(child: buildGroupListLayout(isDesktop)),
              ],
            ),
          ),
        );
      },
    );
  }

  Widget buildGroupListLayout(bool isDesktop) {
    return Container(
      margin: isDesktop ? const EdgeInsets.only(top: 10.0, bottom: 10.0) : null,
      padding: const EdgeInsets.all(10),
      decoration: BoxDecoration(
        color: isDesktop ? Colors.white : Color(0xFFFCFCFC),
      ),
      // decoration: BoxDecoration(
      //     // color: Colors.amber,
      //     // color: bodyColor,
      //     color: Color(0xFFE1F5FE),
      //     border: Border.all(
      //         color: Colors.white,
      //         // color: Color(0xFFF7F7FB),
      //         width: 3.5)),
      child: buildGroupData(isDesktop),
    );
  }

  // Widget buildGroupListView(bool isDesktop) {
  //   return Container(
  //     child: Text("DAta"),
  //   );
  // }

  Widget buildGroupData(isDesktop) {
    return Container(
      // margin: isDesktop
      //     ? EdgeInsets.all(10.0)
      //     : EdgeInsets.only(left: 20.0, bottom: 20.0, top: 10.0, right: 20.0),
      // padding: const EdgeInsets.all(10),
      height:
          isDesktop
              ? MediaQuery.of(context).size.height * 0.98
              : MediaQuery.of(context).size.height,
      // decoration: BoxDecoration(
      //   border: isDesktop
      //       ? Border.all(
      //           width: 2,
      //           color: Colors.white,
      //           // color: Color(0xFFF7F7FB),
      //         )
      //       : null,
      //   color: Colors.white,
      //   // color: Color(0xFFF7F7FB),
      //
      //   // color: Colors.amber,
      // ),
      child: Column(
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              Row(
                children: [
                  Text(
                    'Group List',
                    style: GoogleFonts.poppins(
                      fontSize: isDesktop ? 16 : 14,
                      fontWeight: FontWeight.w600,
                      color: Colors.black,
                    ),
                  ),
                  IconButton(
                    icon: const Icon(Icons.keyboard_arrow_down),
                    onPressed: () {},
                  ),
                ],
              ),
              ElevatedButton(
                style: ElevatedButton.styleFrom(
                  foregroundColor: Colors.white,
                  backgroundColor: Color(0xFF114D8B),
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(8),
                    // side: BorderSide(color: , width: 1),
                  ),
                  padding: EdgeInsets.symmetric(horizontal: 20, vertical: 12),
                ),
                onPressed: () async {
                  // List<dynamic> users = await futureUsers;
                  // context.go('/CreateGroup');
                  showDialog(
                    context: context,
                    builder:
                        (context) => GroupData(
                          isDesktop: isDesktop,
                          groupId: null,
                          layoutColor: layoutColor!,
                          fetchGetGroup: refreshData,
                        ),
                  );
                },
                child: Row(
                  children: [
                    Text('New Group', style: GoogleFonts.poppins(fontSize: 12)),
                    SizedBox(width: 5),
                    Icon(Icons.add_circle_outline_rounded, color: Colors.white),
                  ],
                ),
              ),
            ],
          ),
          SizedBox(height: 5),
          Row(
            children: [
              Expanded(
                child: Container(
                  height: MediaQuery.of(context).size.height * 0.75,
                  padding: const EdgeInsets.all(10),
                  // margin: const EdgeInsets.only(bottom: 10),
                  color: Colors.white,
                  // color: Colors.red.shade100,
                  child: SingleChildScrollView(
                    scrollDirection: Axis.vertical,
                    child: Column(children: [buildGroupListView(isDesktop)]),
                  ),
                ),
              ),
            ],
          ),
        ],
      ),
    );
  }

  Widget buildGroupListView(bool isDesktop) {
    if (apiAllGroups == null || apiAllGroups!.isEmpty) {
      return Center(child: Text("No groups found."));
    }

    return ListView.builder(
      shrinkWrap: true,
      physics: NeverScrollableScrollPhysics(),
      itemCount: apiAllGroups!.length,
      itemBuilder: (context, index) {
        final group = apiAllGroups![index];
        return Card(
          // color: bodyColor,
          // color: Color(0xFFF5F5F5),
          color: Colors.white,
          margin: EdgeInsets.symmetric(vertical: 6, horizontal: 10),
          child: Padding(
            padding: const EdgeInsets.all(12.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  children: [
                    Expanded(
                      child: Text(
                        "Group Name",
                        style: GoogleFonts.poppins(
                          fontSize: 11.5,
                          fontWeight: FontWeight.w400,
                        ),
                      ),
                    ),
                    Expanded(
                      child: Text(
                        "Domestic Policy",
                        style: GoogleFonts.poppins(
                          fontSize: 11.5,
                          fontWeight: FontWeight.w400,
                        ),
                      ),
                    ),
                    Expanded(
                      child: Text(
                        "International Policy",
                        style: GoogleFonts.poppins(
                          fontSize: 11.5,
                          fontWeight: FontWeight.w400,
                        ),
                      ),
                    ),
                    Expanded(
                      child: Text(
                        "Description",
                        style: GoogleFonts.poppins(
                          fontSize: 11.5,
                          fontWeight: FontWeight.w400,
                        ),
                      ),
                    ),
                  ],
                ),
                SizedBox(height: 4),
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Expanded(
                      child: Text(
                        "${group['name']}",
                        style: GoogleFonts.poppins(
                          fontSize: 13,
                          fontWeight: FontWeight.w600,
                        ),
                      ),
                    ),
                    Expanded(
                      child: Text(
                        "${group['domestic_policy_name'] ?? 'N/A'}",
                        style: GoogleFonts.poppins(
                          fontSize: 13,
                          fontWeight: FontWeight.w600,
                        ),
                      ),
                    ),
                    Expanded(
                      child: Text(
                        "${group['international_policy_name']}",
                        style: GoogleFonts.poppins(
                          fontSize: 13,
                          fontWeight: FontWeight.w600,
                        ),
                      ),
                    ),
                    Expanded(
                      child: Text(
                        "${group['description'] ?? 'N/A'}",
                        style: GoogleFonts.poppins(
                          fontSize: 13,
                          fontWeight: FontWeight.w600,
                        ),
                      ),
                    ),
                  ],
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.end,
                  children: [
                    GestureDetector(
                      onTap: () async {
                        if (group['group_id'] != null) {
                          final newGroupID = int.tryParse(
                            group['group_id'].toString(),
                          );
                          if (newGroupID != null) {
                            final data = await apiService.getGroupDetailsFind(
                              context,
                              newGroupID,
                            ); // ✅ Always an int
                            showDialog(
                              context: context,
                              builder:
                                  (context) => GroupData(
                                    isDesktop: isDesktop,
                                    groupId: newGroupID,
                                    // Pass the ID
                                    groupData: data,
                                    layoutColor: layoutColor!,
                                    fetchGetGroup: refreshData,
                                  ),
                            );
                          }
                        } else {
                          print("something went wrong check properly");
                        }
                      },

                      // onTap: () {
                      //   context.go("/CreateGroup", extra: group);
                      // },
                      child: Image.asset(
                        'assets/images/IconsImg/edit.png',
                        width: 20,
                        height: 15,
                      ),
                    ),
                    SizedBox(width: 5),
                    GestureDetector(
                      onTap: () {
                        final idStr = group['group_id'];
                        final id = int.tryParse(idStr.toString());

                        if (id == null) {
                          print("group_id is null");
                          return;
                        }
                        final status = group['is_active'];
                        // print("GroupId : ${group['group_id']} ");
                        deleteGroup(group, id, status);
                      },
                      child: Image.asset(
                        'assets/images/IconsImg/delete.png',
                        width: 20,
                        height: 15,
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ),
        );
      },
    );
  }
}