import 'package:flutter/material.dart';

import '../../core/utils/size_config.dart';

class ProgressBarColumn extends StatefulWidget {
  const ProgressBarColumn({
    super.key,
    required this.text,
    required this.value,
    required this.amount,
  });

  final String text;
  final double value;
  final String amount;

  @override
  State<ProgressBarColumn> createState() => _ProgressBarColumnState();
}

class _ProgressBarColumnState extends State<ProgressBarColumn>
    with SingleTickerProviderStateMixin {
  late AnimationController _controller;
  late Animation<double> _animation;

  @override
  void initState() {
    super.initState();

    // Initialize the animation controller
    _controller = AnimationController(
      vsync: this,
      duration: Duration(milliseconds: 2000), // duration of the animation
    );

    // Create a Tween animation from 0.0 to 0.75
    _animation = Tween<double>(
      begin: 0.0,
      end: widget.value,
    ).animate(CurvedAnimation(parent: _controller, curve: Curves.easeOut));

    // Start the animation
    _controller.forward();
  }

  @override
  void dispose() {
    _controller.dispose(); // clean up controller
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Stack(
          alignment: Alignment.center,
          children: [_progressIndicator(), _centerText()],
        ),
        SizedBox(height: 12.0.h()),
        _titleText(),
      ],
    );
  }

  Widget _progressIndicator() {
    return SizedBox(
      width: 96.0.w(),
      height: 96.0.w(),
      child: AnimatedBuilder(
        animation: _animation,
        builder:
            (context, child) => CircularProgressIndicator(
              backgroundColor: Color(0xFFE1E1E1),
              strokeCap: StrokeCap.round,
              strokeWidth: 8.0,
              valueColor: AlwaysStoppedAnimation<Color>(Color(0xFF34BCCB)),
              value: _animation.value,
            ),
      ),
    );
  }

  Widget _centerText() {
    return Center(
      child: Text(
        widget.amount,
        style: TextStyle(fontSize: 24.0.sp(), fontWeight: FontWeight.bold),
        textAlign: TextAlign.center,
      ),
    );
  }

  Widget _titleText() {
    return Text(
      widget.text,
      style: TextStyle(
        fontSize: 16.0.sp(),
        fontWeight: FontWeight.bold,
        color: Color(0xFF222222),
      ),
    );
  }
}