import 'package:flutter/material.dart';
import 'package:food_delivery_client/core/core.dart';

class GradientSwitch extends StatefulWidget {
  final bool value;
  final ValueChanged<bool> onChanged;
  final double width;
  final double height;
  final Duration duration;

  const GradientSwitch({
    super.key,
    required this.value,
    required this.onChanged,
    this.width = 48,
    this.height = 26,
    this.duration = const Duration(milliseconds: 250),
  });

  @override
  State<GradientSwitch> createState() => _GradientSwitchState();
}

class _GradientSwitchState extends State<GradientSwitch>
    with SingleTickerProviderStateMixin {
  late bool _isOn;

  @override
  void initState() {
    super.initState();
    _isOn = widget.value;
  }

  @override
  void didUpdateWidget(covariant GradientSwitch oldWidget) {
    super.didUpdateWidget(oldWidget);
    if (oldWidget.value != widget.value) {
      _isOn = widget.value;
    }
  }

  void _toggle() {
    setState(() => _isOn = !_isOn);
    widget.onChanged(_isOn);
  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: _toggle,
      child: AnimatedContainer(
        duration: widget.duration,
        width: widget.width,
        height: widget.height,
        padding: const EdgeInsets.all(3),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(widget.height / 2),
          gradient: _isOn
              ? LinearGradient(
                  colors: [AppColors.cFF6F00, AppColors.cFFAB40],
                  begin: Alignment.topCenter,
                  end: Alignment.bottomCenter,
                )
              : null,
          color: _isOn ? null : context.appThemeColors.inActiveColor2,
        ),
        child: Stack(
          children: [
            AnimatedAlign(
              duration: widget.duration,
              alignment: _isOn ? Alignment.centerRight : Alignment.centerLeft,
              curve: Curves.easeInOut,
              child: Container(
                width: widget.height - 4,
                height: widget.height - 4,
                decoration: BoxDecoration(
                  color: AppColors.cFFFFFF,
                  borderRadius: BorderRadius.circular(widget.height / 2),
                  boxShadow: [
                    BoxShadow(
                      color: AppColors.c292F3D.newWithOpacity(.25),
                      blurRadius: 4,
                      offset: const Offset(0, 10),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
