import 'package:dart_jsonwebtoken/dart_jsonwebtoken.dart';
import 'package:flutter/material.dart';
import 'package:flutter_animate/flutter_animate.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_secure_storage/flutter_secure_storage.dart';
import 'package:flutter_svg/svg.dart';
import 'package:image_picker/image_picker.dart';
import 'package:proxibuy/core/config/app_colors.dart';
import 'package:proxibuy/core/gen/assets.gen.dart';
import 'package:proxibuy/data/models/offer_model.dart';
import 'package:proxibuy/features/add_photo/cubit/add_photo_cubit.dart';
import 'package:proxibuy/presentation/pages/reservation_details_screen.dart';
import 'package:proxibuy/presentation/reservation/cubit/reservation_cubit.dart';
import 'package:proxibuy/presentation/widgets/flutter_staggered_grid_view.dart';

class AddPhotoScreen extends StatelessWidget {
  final String storeName;
  final String productId;
  final OfferModel offer;

  const AddPhotoScreen({
    super.key,
    required this.storeName,
    required this.productId,
    required this.offer,
  });

  //  متد ساخت توکن
  Future<String> _generateQrToken(BuildContext context) async {
    const storage = FlutterSecureStorage();
    final userID = await storage.read(key: 'userID');

    if (userID == null) {
      ScaffoldMessenger.of(context).showSnackBar(
        const SnackBar(content: Text("خطا: کاربر شناسایی نشد.")),
      );
      throw Exception("User ID not found");
    }

    final payload = {
      'userID': userID,
      'discountID': offer.id,
      'iat': DateTime.now().millisecondsSinceEpoch ~/ 1000,
    };

    const secretKey = 'your_super_secret_key_for_qr';
    final jwt = JWT(payload);
    final token = jwt.sign(SecretKey(secretKey));

    return token;
  }

  void _showImageSourceActionSheet(BuildContext context) {
    showModalBottomSheet(
      context: context,
      shape: const RoundedRectangleBorder(
        borderRadius: BorderRadius.vertical(top: Radius.circular(20.0)),
      ),
      builder: (bottomSheetContext) {
        return SafeArea(
          child: Wrap(
            children: <Widget>[
              ListTile(
                leading:
                    const Icon(Icons.photo_library, color: AppColors.primary),
                title: const Text('انتخاب از گالری'),
                onTap: () {
                  Navigator.of(bottomSheetContext).pop();
                  context.read<AddPhotoCubit>().pickImage(ImageSource.gallery);
                },
              ),
              ListTile(
                leading:
                    const Icon(Icons.camera_alt, color: AppColors.primary),
                title: const Text('گرفتن عکس با دوربین'),
                onTap: () {
                  Navigator.of(bottomSheetContext).pop();
                  context.read<AddPhotoCubit>().pickImage(ImageSource.camera);
                },
              ),
            ],
          ),
        );
      },
    );
  }

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (context) => AddPhotoCubit()..fetchPhotos(),
      child: Builder(builder: (context) {
        return Scaffold(
          appBar: _buildCustomAppBar(context),
          body: Padding(
            padding: const EdgeInsets.all(16.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              children: [
                SizedBox(
                  height: 10,
                ),
                _buildHeader()
                    .animate()
                    .fadeIn(duration: 500.ms)
                    .slideY(begin: -0.2, curve: Curves.easeOut),
                const SizedBox(height: 24),
                SizedBox(
                  child: BlocBuilder<AddPhotoCubit, AddPhotoState>(
                    builder: (context, state) {
                      if (state is AddPhotoLoading) {
                        return const Center(child: CircularProgressIndicator());
                      }
                      if (state is AddPhotoLoaded) {
                        return PhotoGalleryView(
                          imageUrls: state.imageUrls,
                          remainingPhotos: state.remainingPhotos,
                        ).animate().scale(
                            delay: 200.ms,
                            duration: 400.ms,
                            curve: Curves.easeOutBack);
                      }
                      if (state is AddPhotoError) {
                        return Center(child: Text(state.message));
                      }
                      return const SizedBox.shrink();
                    },
                  ),
                ),
                const SizedBox(height: 24),
                _buildUploadButton(context)
                    .animate()
                    .fadeIn(delay: 400.ms)
                    .slideY(begin: 0.5, curve: Curves.easeOut),
              ],
            ),
          ),
        );
      }),
    );
  }

  Widget _buildHeader() {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Row(
          children: [
            SvgPicture.asset(
              Assets.icons.shop.path,
              height: 30,
              colorFilter: const ColorFilter.mode(
                Color.fromARGB(255, 95, 95, 95),
                BlendMode.srcIn,
              ),
            ),
            const SizedBox(width: 10),
            Text(
              storeName,
              style: const TextStyle(fontSize: 22, fontWeight: FontWeight.bold),
            ),
          ],
        ),
        const SizedBox(height: 16),
        const Text(
          'یه عکس جذاب از محصولی که از ما خریدی بارگذاری کن تا عضو کلاب مشتریان وفادارمون بشی!',
          style: TextStyle(fontSize: 16, color: Colors.black, height: 1.5),
        ),
      ],
    );
  }

  Widget _buildUploadButton(BuildContext context) {
    return ElevatedButton(
      onPressed: () {
        final isReserved =
            context.read<ReservationCubit>().isProductReserved(productId);

        if (isReserved) {
          _showImageSourceActionSheet(context);
        } else {
          _showReservationPopup(context);
        }
      },
      style: ElevatedButton.styleFrom(
        padding: const EdgeInsets.symmetric(vertical: 8),
        backgroundColor: AppColors.uploadElevated,
        side: BorderSide(color: AppColors.active, width: 1.7),
        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(50)),
      ),
      child: Padding(
        padding: const EdgeInsets.all(8.0),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            SvgPicture.asset(Assets.icons.galleryAdd.path),
            const SizedBox(width: 10),
            const Text(
              'بارگذاری',
              style: TextStyle(fontSize: 16, color: AppColors.active),
            ),
          ],
        ),
      ),
    );
  }

  PreferredSizeWidget _buildCustomAppBar(BuildContext context) {
    return PreferredSize(
      preferredSize: const Size.fromHeight(70.0),
      child: Container(
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: const BorderRadius.vertical(
            bottom: Radius.circular(15),
          ),
          boxShadow: [
            BoxShadow(
              color: Colors.black.withOpacity(0.08),
              blurRadius: 10,
              offset: const Offset(0, 4),
            ),
          ],
        ),
        child: SafeArea(
          child: Padding(
            padding: const EdgeInsets.fromLTRB(16, 8, 16, 8),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.end,
              children: [
                const Text(
                  'آپلود عکس',
                  style: TextStyle(
                    color: Colors.black,
                    fontWeight: FontWeight.normal,
                    fontSize: 18,
                  ),
                ),
                IconButton(
                  icon: SvgPicture.asset(Assets.icons.arrowLeft.path),
                  onPressed: () => Navigator.of(context).pop(),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }

  void _showReservationPopup(BuildContext context) {
    showDialog(
      context: context,
      barrierDismissible: false,
      builder: (BuildContext dialogContext) {
        return Dialog(
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(15),
          ),
          elevation: 10,
          backgroundColor: Colors.white,
          child: Stack(
            clipBehavior: Clip.none,
            alignment: Alignment.topCenter,
            children: [
              Padding(
                padding: const EdgeInsets.only(
                  top: 40,
                  left: 20,
                  right: 20,
                  bottom: 20,
                ),
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  children: [
                    const SizedBox(height: 10),
                    const Padding(
                      padding: EdgeInsets.all(15.0),
                      child: Text(
                        "اول خرید کن، بعدا عکس بگیر!",
                        style: TextStyle(
                          fontSize: 16,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                    ),
                    const SizedBox(height: 5),
                    const Text(
                      "یه محصول رو از فروشگاهمون رزرو کن و ازمون تحویلش بگیر، بعدش می‌تونی عکسشو اینجا آپلود کنی.",
                      style: TextStyle(color: AppColors.hint, fontSize: 16),
                      textAlign: TextAlign.start,
                    ),
                    const SizedBox(height: 20),
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                      children: [
                        GestureDetector(
                          onTap: () => Navigator.of(dialogContext).pop(),
                          child: Text(
                            "الان نه",
                            style: TextStyle(
                              color: AppColors.primary,
                              fontWeight: FontWeight.bold,
                            ),
                          ),
                        ),
                        ElevatedButton(
                          style: ElevatedButton.styleFrom(
                            backgroundColor: AppColors.primary,
                            foregroundColor: Colors.white,
                            shape: RoundedRectangleBorder(
                              borderRadius: BorderRadius.circular(8),
                              side: const BorderSide(color: AppColors.border),
                            ),
                            padding: const EdgeInsets.symmetric(
                              horizontal: 45,
                              vertical: 7,
                            ),
                          ),
                          onPressed: () async {
                            try {
                              final qrToken = await _generateQrToken(context);

                              context
                                  .read<ReservationCubit>()
                                  .reserveProduct(productId);
                                  
                              Navigator.of(dialogContext).pop();
                              
                              Navigator.push(
                                context,
                                MaterialPageRoute(
                                  builder: (_) => ReservationConfirmationPage(
                                    offer: offer,
                                    qrCodeData: qrToken,
                                  ),
                                ),
                              );
                            } catch (e) {
                                print("Error in reservation popup: $e");
                            }
                          },
                          child: const Text(
                            "رزرو محصول",
                            style: TextStyle(color: Colors.white),
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
              ),
              Positioned(
                top: -40,
                child: Container(
                  decoration: BoxDecoration(
                    shape: BoxShape.circle,
                    boxShadow: [
                      BoxShadow(
                        color: Colors.black.withOpacity(0.3),
                        blurRadius: 8,
                        offset: const Offset(0, 4),
                      ),
                    ],
                  ),
                  child: CircleAvatar(
                    backgroundColor: Colors.white,
                    radius: 40,
                    child: Padding(
                      padding: const EdgeInsets.all(12.0),
                      child: SvgPicture.asset(Assets.icons.camera.path),
                    ),
                  ),
                ),
              ),
            ],
          ),
        );
      },
    );
  }
}