// ignore_for_file: must_be_immutable, unused_local_variable, deprecated_member_use

import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:lba/extension/screenSize.dart';
import 'package:lba/gen/assets.gen.dart';
import 'package:lba/widgets/orderType.dart';
import 'package:lba/widgets/remainingTime.dart';

class ListScreen extends StatefulWidget {
  final bool delivery;
  final bool pickup;
  int initialTimerStatus; 
  final String expiryTimeString;
  final VoidCallback? ontap;

  ListScreen({
    super.key,
    required this.delivery,
    required this.pickup,
    this.initialTimerStatus=3,
    required this.expiryTimeString,
    this.ontap,
  });

  @override
  State<ListScreen> createState() => _ListScreenState();
}

class _ListScreenState extends State<ListScreen> {
  late RemainingTime _timer;
  late ValueNotifier<int> _timerStatus;

  @override
  void initState() {
    super.initState();
    _timer = RemainingTime();
    _timerStatus = ValueNotifier<int>(widget.initialTimerStatus);
    _timer.initializeFromExpiry(expiryTimeString: widget.expiryTimeString);

    _timer.remainingSeconds.addListener(() {
      if (_timer.remainingSeconds.value <= 0) {
        _timerStatus.value = 3; 
      } else if (_timer.remainingSeconds.value < 18000) {
        _timerStatus.value = 1; 
      } else if (_timer.remainingSeconds.value > 18000) {
        _timerStatus.value = 2; 
      }
    });
  }

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

  @override
  Widget build(BuildContext context) {
    final width = context.screenWidth;
    final height = context.screenHeight;
    return 
      GestureDetector(
        onTap: widget.ontap,
        child: Padding(
          padding: const EdgeInsets.only(bottom: 16),
          child: Stack(
            children: [
              Container(
                margin: const EdgeInsets.only(top: 60),
                padding: const EdgeInsets.only(top: 80),
                decoration: BoxDecoration(
                  color: const Color.fromARGB(255, 242, 242, 241),
                  borderRadius: BorderRadius.circular(10),
                ),
                child: Padding(
                  padding: EdgeInsets.fromLTRB(12, 0, width/50, 15),
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      Expanded(
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.stretch,
                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                          children: [
                            Row(
                              children: [
                                SvgPicture.asset(Assets.icons.phCheese.path),
                                const SizedBox(width: 5),
                                const Text(
                                  "Amul Cheese Slices",
                                  style: TextStyle(fontWeight: FontWeight.bold),
                                ),
                              ],
                            ),
                            const SizedBox(height: 10),
                            Row(
                              children: [
                                SvgPicture.asset(
                                  Assets.icons.location.path,
                                  color: const Color.fromARGB(255, 157, 157, 155),
                                  width: 14,
                                ),
                                const SizedBox(width: 5),
                                const Text("Sharjah (750m away)",style: TextStyle(
                                  fontSize: 12,
                                  fontWeight: FontWeight.w500
                                ),),
                              ],
                            ),
                            const SizedBox(height: 10),
                            Row(
                              children: [
                                SvgPicture.asset(
                                  Assets.icons.coin.path,
                                  width: 14,
                                ),
                                const SizedBox(width: 5),
                                Column(
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: const [
                                    Text(
                                      "18.15 AED",
                                      style: TextStyle(
                                        color: Color.fromARGB(255, 157, 157, 155),
                                        fontSize: 10,
                                        decoration: TextDecoration.lineThrough,
                                      ),
                                    ),
                                    SizedBox(height: 0),
                                    Row(
                                      children: [
                                        Text("15.84 AED",style: TextStyle(
                                          fontSize: 12,
                                          fontWeight: FontWeight.w500
                                        ),),
                                        SizedBox(width: 4),
                                        Text(
                                          "(13% off)",
                                          style: TextStyle(
                                            color: Color.fromARGB(255, 76, 175, 80),
                                            fontSize: 10,
                                            fontWeight: FontWeight.w500
                                          ),
                                        ),
                                      ],
                                    ),
                                  ],
                                ),
                              ],
                            ),
                          ],
                        ),
                      ),
                      Padding(
                        padding: EdgeInsets.fromLTRB(0, 35, widget.delivery == false || widget.pickup == false ? width/5 : width/60, 0),
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.end,
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            Row(
                              mainAxisAlignment: MainAxisAlignment.center,
                              crossAxisAlignment: CrossAxisAlignment.center,
                              children: [
                                SvgPicture.asset(
                                  Assets.icons.star.path,
                                  width: 14,
                                ),
                                const SizedBox(width: 2),
                                const Text(
                                  "4.8",
                                  style: TextStyle(
                                    color: Color.fromARGB(255, 112, 112, 110),
                                  ),
                                ),
                              ],
                            ),
                            const SizedBox(height: 10),
                            Row(
                              children: [
                                if (widget.delivery)
                                  OrderType(
                                    icon: Assets.icons.cardPos.path,
                                    typename: "Delivery",
                                    fill: false,
                                  ),
                                if (widget.delivery) const SizedBox(width: 5),
                                if (widget.pickup)
                                  OrderType(
                                    icon: Assets.icons.shoppingCart.path,
                                    typename: "Pickup",
                                    fill: false,
                                  ),
                              ],
                            ),
                          ],
                        ),
                      ),
                    ],
                  ),
                ),
              ),
              ClipRRect(
                borderRadius: const BorderRadius.only(
                  topRight: Radius.circular(10),
                  topLeft: Radius.circular(10),
                ),
                child: Image.asset(
                  Assets.images.media.path,
                  width: double.infinity,
                  height: 130,
                  fit: BoxFit.cover,
                ),
              ),
              Positioned(
                top: 10,
                left: 10,
                child: ValueListenableBuilder<int>(
                  valueListenable: _timerStatus,
                  builder: (context, timerStatus, child) {
                    return Container(
                      padding: const EdgeInsets.symmetric(horizontal: 6),
                      height: 20,
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(6),
                        color: timerStatus == 1
                            ? const Color.fromARGB(255, 255, 193, 7)
                            : timerStatus == 2
                                ? const Color.fromARGB(255, 76, 175, 80)
                                : timerStatus == 3
                                    ? const Color.fromARGB(255, 244, 67, 54)
                                    : const Color.fromARGB(255, 244, 67, 54),
                      ),
                      child: Row(
                        children: [
                          SvgPicture.asset(
                            timerStatus == 1
                                ? Assets.icons.timer.path
                                : timerStatus == 2
                                    ? Assets.icons.timerStart.path
                                    : Assets.icons.timerPause.path,
                            width: 12,
                            height: 12,
                          ),
                          const SizedBox(width: 5),
                          ValueListenableBuilder<int>(
                            valueListenable: _timer.remainingSeconds,
                            builder: (context, seconds, child) {
                              return Text(
                                timerStatus==3? "Unavailable":"${_timer.formatTime()} left",
                                style: const TextStyle(
                                  color: Colors.white,
                                  fontSize: 12,
                                  fontWeight: FontWeight.w400,
                                ),
                              );
                            },
                          ),
                        ],
                      ),
                    );
                  },
                ),
              ),
            ],
          ),
        ),
      );
  }
}