import 'dart:developer';
import 'dart:io';

import 'package:wanisclient/config/custom_text.dart';
import 'package:wanisclient/providers/utils_singleton.dart';
import 'package:wanisclient/screens/privacy_policyScreen.dart';
import 'package:wanisclient/screens/support.dart';
import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:image_picker/image_picker.dart';
import 'package:provider/provider.dart';
import 'package:shared_preferences/shared_preferences.dart'
    show SharedPreferences;
import 'package:sidebarx/sidebarx.dart';
import 'package:flutter_lucide/flutter_lucide.dart';

import '../config/CustomPoup.dart';
import '../config/constants/app_constant.dart';
import '../config/constants/arabe.dart' as Language;
import '../providers/authentification_provider.dart';
import '../providers/language_provider.dart';
import '../providers/utils_singleton.dart';
import '../providers/utils_singleton.dart' as utill;
import '../utils/colors.dart';
import '../utils/sized.dart';
import '../widgets/change_lang_drop_down.dart';
import '../widgets/custom_button.dart';
import '../widgets/profile_choice_card.dart';
import 'NewUiScreen/EditLanguage.dart';
import 'NotificationsSettingScreen.dart';
import 'about.dart';
import 'edit_profile_screen.dart';
import 'myadresses_screen.dart';

class Profile extends StatefulWidget {
  Profile({super.key, required this.controllerSideBar});

  final SidebarXController controllerSideBar;

  @override
  State<Profile> createState() => _ProfileState();
}

class _ProfileState extends State<Profile> {
  bool isDarkMode =false;
  Widget _avatar(BuildContext ctx) {
    return ClipOval(
      child: CachedNetworkImage(
        imageUrl: '$mediaUrl${utils.user?.image?.url}',
        width: 48,
        height: 48,
        fit: BoxFit.fill,
        placeholder: (_, __) => const CircularProgressIndicator(),
        errorWidget: (_, __, ___) => Image.asset(
          'assets/images/wanislogo.png',
          width: 48,
          height: 48,
          fit: BoxFit.cover,
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    final languageProvider = context.watch<LanguageProvider>();
    bool isArabic = languageProvider.currentLangCode == Language.ar;
    final authProvider = context.watch<AuthProvider>();
    return SafeArea(
      child: Scaffold(
        backgroundColor: Colors.white,
        body: SingleChildScrollView(
          child: Padding(
            padding: const EdgeInsets.all(16.0),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.start,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                const SizedBox(height: 16),
                Row(
                  children: [
                    _avatar(context),
                    const SizedBox(width: 12),
                     const Txt(
                      text: 'Hello',
                      style:
                          TextStyle(fontWeight: FontWeight.bold, fontSize: 17),
                    ),
                    Txt(
                      text: ", ${utils.user?.name ?? 'Guest'}",
                      style: const TextStyle(
                          fontWeight: FontWeight.bold, fontSize: 17),
                    ),
                  ],
                ),
                const SizedBox(height: 24),
                Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(32),
                    border: Border.all(color: Colors.grey.shade300),
                  ),
                  child: Padding(
                    padding: const EdgeInsets.all(16.0),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        const Txt(
                          text: 'Profile',
                          style: TextStyle(
                              fontWeight: FontWeight.bold, fontSize: 17),
                        ),
                        const SizedBox(height: 16),
                        Padding(
                          padding: const EdgeInsets.symmetric(vertical: 8.0),
                          child: GestureDetector(
                            onTap: () {
                              Navigator.push(
                                context,
                                MaterialPageRoute(
                                    builder: (context) => const EditProfileScreen()),
                              );
                            },
                            child: const ProfileChoiceCard(text: "Edit profile",
                                icon:  LucideIcons.circle_user_round),
                          ),
                        ),
                        const SizedBox(height: 16),
                        Padding(
                          padding: const  EdgeInsets.symmetric(vertical: 8.0),
                          child: GestureDetector(
                            onTap: () {
                              Navigator.push(
                                context,
                                MaterialPageRoute(
                                    builder: (context) => MyAdresses()),
                              );
                            },
                            child: const ProfileChoiceCard(
                                text:   "My Addresses", icon:  LucideIcons.map),
                          ),
                        ),
                        const SizedBox(height: 16),
                      ],
                    ),
                  ),
                ),

                const SizedBox(height: 24),
                Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(32),
                    border: Border.all(color: Colors.grey.shade300),
                  ),
                  child: Padding(
                    padding: const EdgeInsets.all(16.0),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        const Txt(
                          text: 'Appearance',
                          style: TextStyle(
                              fontWeight: FontWeight.bold, fontSize: 17),
                        ),
                        const SizedBox(height: 16),
                        Padding(
                          padding: const EdgeInsets.symmetric(vertical: 8.0),
                          child: GestureDetector(
                            onTap: () {
                              Navigator.push(
                                context,
                                MaterialPageRoute(
                                    builder: (context) => const EditLanguageScreen()),
                              );
                            },
                            child: const ProfileChoiceCard(text: "Language", icon:  LucideIcons.languages),
                          ),
                        ),
                        const SizedBox(height: 16),
                        Padding(
                          padding:const EdgeInsets.symmetric(vertical: 8.0),
                          child: profileChoiceCardWithSwitch(
                            text: "Dark Mode",
                            switchValue: isDarkMode,
                            onSwitchChanged: (value) => setState(() => isDarkMode = value),
                            icon: LucideIcons.moon,
                            isArabic: false,
                            isReadOnly: true, // 🔒 makes it non-editable
                          ),
                        ),
                        const SizedBox(height: 16),
                        Padding(
                          padding:const EdgeInsets.symmetric(vertical: 8.0),
                          child: GestureDetector(
                            onTap: () {
                              Navigator.push(
                                context,
                                MaterialPageRoute(
                                    builder: (context) => NotificationSettingsScreen()),
                              );
                            },
                            child:
                            const ProfileChoiceCard(text:  "Notifications", icon: LucideIcons.bell_ring,),
                          ),
                        ),
                        const SizedBox(height: 16),
                      ],
                    ),
                  ),
                ),
                const SizedBox(height: 24),

                Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(32),
                    border: Border.all(color: Colors.grey.shade300),
                  ),
                  child: Padding(
                    padding: const EdgeInsets.all(16.0),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        const Txt(
                          text: 'Help Center',
                          style: TextStyle(
                              fontWeight: FontWeight.bold, fontSize: 17),
                        ),
                        const SizedBox(height: 16),
                        Padding(
                          padding: const EdgeInsets.symmetric(vertical: 8.0),
                          child: GestureDetector(
                            onTap: () {
                              Navigator.push(
                                context,
                                MaterialPageRoute(
                                    builder: (context) => const Support(withBack : true
                                    )),
                              );
                            },
                            child:  const ProfileChoiceCard(text: "Customer Service", icon:  LucideIcons.shield_question),
                          ),
                        ),

                        const SizedBox(height: 16),
                        Padding(
                          padding:const EdgeInsets.symmetric(vertical: 8.0),
                          child: GestureDetector(
                            onTap: () {
                              Navigator.push(
                                context,
                                MaterialPageRoute(
                                    builder: (context) => const About(withBack : true)),
                              );
                            },
                            child:
                            const ProfileChoiceCard(text:  "About App", icon: LucideIcons.shield_alert,),
                          ),
                        ),
                        const SizedBox(height: 16),
                      ],
                    ),
                  ),
                ),
                const SizedBox(height: 24),

                Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(32),
                    border: Border.all(color: Colors.grey.shade300),
                  ),
                  child: Padding(
                    padding: const EdgeInsets.all(16.0),
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        const Txt(
                          text: 'Help Center',
                          style: TextStyle(
                              fontWeight: FontWeight.bold, fontSize: 17),
                        ),
                        const SizedBox(height: 16),
                        GestureDetector(
                          onTap: () async {
                            await authProvider.logOut();
                          },
                          child: const ProfileChoiceCard(
                              text: "Logout",icon: LucideIcons.log_out ),
                        ),

                        const SizedBox(height: 16),
                        GestureDetector(
                          onTap: () {
                            showDialog(
                              context: context,
                              barrierDismissible: false,
                              builder: (context) => CustomPopup(
                                imagePath: 'assets/images/taxipoking.png',
                                twoButton: true,
                                loader: authProvider.logoutloading,
                                message: 'Are you sure you want to delete your account',
                                onOk: () async {
                                  await authProvider.logOut();
                                },
                              ),
                            );
                          },
                          child: const ProfileChoiceCard(
                              text: "Delete Account",icon: LucideIcons.trash_2 ),
                        ),
                        const SizedBox(height: 16),
                      ],
                    ),
                  ),
                ),


                // Padding(
                //   padding: const EdgeInsets.symmetric(horizontal: 28.0),
                //   child: Container(
                //     height: 40,
                //     width: double.infinity,
                //     padding: const EdgeInsets.symmetric(horizontal: 22),
                //     decoration: BoxDecoration(
                //       color: Colors.white,
                //       borderRadius:
                //           BorderRadius.circular(24), // <-- Adjust radius here
                //       boxShadow: [
                //         BoxShadow(
                //           color: Colors.grey.withOpacity(0.3),
                //           spreadRadius: 2,
                //           blurRadius: 5,
                //           offset: const Offset(0, 3),
                //         ),
                //       ],
                //     ),
                //     child: const LangDropDown(),
                //   ),
                // ),
                // const SizedBox(height: 20),

                // GestureDetector(
                //   onTap: () {
                //     //TODO moving to Payment Historique
                //     widget.controllerSideBar.selectIndex(2);
                //   },
                //   child: ProfileChoiceCard(
                //       "My Balance", false, LucideIcons.map,isArabic , context),
                // ),

                // GestureDetector(
                //   onTap: () {
                //     Navigator.push(
                //       context,
                //       MaterialPageRoute(
                //           builder: (context) => const PrivacyPolicyscreen()),
                //     );
                //   },
                //   child: ProfileChoiceCard("Terms & Conditions", false,
                //       LucideIcons.circle_user_round,isArabic , context),
                // ),
                // GestureDetector(
                //   onTap: () {
                //     showDialog(
                //       context: context,
                //       barrierDismissible: false,
                //       builder: (context) => CustomPopup(
                //         imagePath: 'assets/images/beemcar.png',
                //         twoButton: true,
                //         loader: authProvider.logoutloading,
                //         message: 'Are you sure you want to delete your account',
                //         onOk: () async {
                //           await authProvider.logOut();
                //         },
                //       ),
                //     );
                //   },
                //   child: profile_choice_card(
                //       "Delete Account", true, LucideIcons.map,isArabic , context),
                // ),
                // const SizedBox(height: 10),
              ],
            ),
          ),
        ),
      ),
    );
  }
}