import 'package:flutter/material.dart';
import 'package:syncrow_web/utils/color_manager.dart';

class CounterWidget extends StatefulWidget {
  @override
  _CounterWidgetState createState() => _CounterWidgetState();
}

class _CounterWidgetState extends State<CounterWidget> {
  int _counter = 0;

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 5),
      decoration: BoxDecoration(
        color: ColorsManager
            .counterBackgroundColor, // Background color for the counter
        borderRadius: BorderRadius.circular(20), // Rounded corners
      ),
      child: Row(
        mainAxisSize: MainAxisSize.min,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          // Decrement button
          GestureDetector(
            onTap: () {
              setState(() {
                if (_counter > 0) {
                  _counter--;
                }
              });
            },
            child: Icon(
              Icons.remove,
              color: ColorsManager.spaceColor, // Blue color
              size: 18, // Icon size
            ),
          ),
          const SizedBox(width: 8),
          // Counter value display
          Text(
            '$_counter',
            style: const TextStyle(
              color: ColorsManager.spaceColor, // Blue color
              fontSize: 16,
            ),
          ),
          const SizedBox(width: 8),
          // Increment button
          GestureDetector(
            onTap: () {
              setState(() {
                _counter++;
              });
            },
            child: const Icon(
              Icons.add,
              color: ColorsManager.spaceColor, // Blue color
              size: 18, // Icon size
            ),
          ),
        ],
      ),
    );
  }
}