import 'dart:io';

import 'package:wanisclient/utils/colors.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:provider/provider.dart';
import 'package:shared_preferences/shared_preferences.dart';

import '../../../config/custom_text.dart';
import '../../../config/language/language_enum.dart';
import '../../../providers/authentification_provider.dart';
import '../../../providers/language_provider.dart';
import '../../../providers/utils_singleton.dart' as utill;
import '../../../routes/app_routes.dart';
import '../../../widgets/custom_button.dart';

class ReviewProfilePicture extends StatefulWidget {
  final File imageFile;

  const ReviewProfilePicture({
    super.key,
    required this.imageFile,
  });

  @override
  State<ReviewProfilePicture> createState() => _ReviewProfilePictureState();
}

class _ReviewProfilePictureState extends State<ReviewProfilePicture> {
  bool _isLoading = false;
  File? _pickedImage;

  Future<void> _uploadImage() async {
    setState(() {
      _isLoading = true;
    });

    if (widget.imageFile != null) {
      final File imageFile = File(widget.imageFile.path);
      final prefs = await SharedPreferences.getInstance();
      String token = prefs.getString('token')!;
      bool success = await utill.uploadProfileImage(
          imageFile, widget.imageFile.path.split('/').last, token);
      await Provider.of<AuthProvider>(context, listen: false).fetchProfile();
      if (success) {
        await Provider.of<AuthProvider>(context, listen: false).fetchProfile();
        Get.toNamed(AppRoutes.home);
      }

      if (success) {
        setState(() {
          _pickedImage = imageFile;
        });
      } else {
        print("Upload failed, not updating _pickedImage.");
      }
    }
    setState(() {
      _isLoading = false;
    });
  }

  void _chooseAnotherPicture() {
    // Use `Navigator.of(context).pop()` to close this screen and return to the previous one
    Navigator.of(context).pop();
  }

  @override
  Widget build(BuildContext context) {
    final languageProvider =
        context.watch<LanguageProvider>(); // Watch for changes
    bool isArabic = languageProvider.currentLangCode == Language.ar;
    return Scaffold(
      backgroundColor: AppNewColors.whiteBackGround,
      body: SafeArea(
        child: Padding(
          padding: const EdgeInsets.all(16.0),
          child: Column(
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              const SizedBox(height: 10),
              GestureDetector(
                onTap: () {
                  Navigator.pop(context);
                },
                child: Container(
                  width: 32,
                  height: 32,
                  margin: const EdgeInsets.symmetric(vertical: 12),
                  decoration: BoxDecoration(
                    color: AppNewColors.lightgray,
                    borderRadius: BorderRadius.circular(16),
                    boxShadow: [
                      BoxShadow(
                        color: AppNewColors.black.withOpacity(.1),
                        blurRadius: 1,
                        offset: const Offset(2, 1),
                      ),
                    ],
                  ),
                  child: const Icon(
                    Icons.arrow_back,
                    color: AppNewColors.black,
                    size: 16,
                  ),
                ),
              ),
              const SizedBox(height: 24),
              // Title
              Txt(
                text: "Review your picture",
                style: TextStyle(
                  color: AppNewColors.titleTextColor,
                  fontSize: 26,
                  fontFamily: isArabic ? "Readex_Pro" : 'Inter',
                  fontWeight: FontWeight.w600,
                  height: 1.23,
                ),
              ),
              const SizedBox(height: 12),
              // Description
              Txt(
                text:
                    "Please check and make sure that your face is clearly visible.",
                style: TextStyle(
                  color: AppNewColors.inputTextColor,
                  fontSize: 18,
                  fontFamily: isArabic ? "Readex_Pro" : 'Inter',
                  fontWeight: FontWeight.w500,
                  height: 1.33,
                ),
              ),
              const SizedBox(height: 32),
              Center(
                child: Container(
                  width: 240,
                  height: 240,
                  decoration: ShapeDecoration(
                    image: DecorationImage(
                      image: FileImage(_pickedImage ?? widget.imageFile),
                      fit: BoxFit.fill,
                    ),
                    shape: const OvalBorder(),
                  ),
                ),
              ),
              const SizedBox(height: 24),
              CustomButton(
                onClick: _uploadImage,
                fontSize: 14,
                width: double.infinity,
                height: 40,
                borderRadius: 10,
                txtColor: AppNewColors.white,
                title: 'confirm_picture',
                backgroundColor: AppNewColors.primaryBtnColor,
                borderColor: AppNewColors.primaryBtnColor,
              ),
              const SizedBox(height: 12),
              CustomButton(
                onClick: _chooseAnotherPicture,
                fontSize: 14,
                width: double.infinity,
                height: 40,
                borderRadius: 10,
                txtColor: AppNewColors.primaryBtnColor,
                title: 'choose_another_picture',
                backgroundColor: AppNewColors.primaryLoginColor,
                borderColor: AppNewColors.primaryLoginColor,
              ),
            ],
          ),
        ),
      ),
    );
  }
}