import 'package:flutter/material.dart';

class MoistureGauge extends StatelessWidget {

  final int value;
  final int min;
  final int max;

  const MoistureGauge({
    super.key,
    required this.value,
    required this.min,
    required this.max,
  });

  Color getColor() {
    if (value < min) return Colors.redAccent;
    if (value > max) return Colors.blueAccent;
    return Colors.orangeAccent; // area hysteresis
  }

  String getStatus() {
    if (value < min) return "Kering";
    if (value > max) return "Basah";
    return "Stabil";
  }

  @override
  Widget build(BuildContext context) {

    final color = getColor();

    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [

        const Text(
          "Soil Moisture",
          style: TextStyle(color: Colors.white70),
        ),

        const SizedBox(height: 10),

        Stack(
          alignment: Alignment.center,
          children: [

            /// background
            SizedBox(
              width: 90,
              height: 90,
              child: CircularProgressIndicator(
                value: 1,
                strokeWidth: 10,
                color: Colors.white12,
              ),
            ),

            /// value
            SizedBox(
              width: 90,
              height: 90,
              child: CircularProgressIndicator(
                value: value / 100,
                strokeWidth: 10,
                strokeCap: StrokeCap.round,
                color: color,
              ),
            ),

            /// center text
            Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                Text(
                  "$value%",
                  style: TextStyle(
                    color: color,
                    fontSize: 18,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                Text(
                  getStatus(),
                  style: const TextStyle(
                    color: Colors.white54,
                    fontSize: 11,
                  ),
                ),
              ],
            ),
          ],
        ),

        const SizedBox(height: 8),

        Text(
          "Min: $min | Max: $max",
          style: const TextStyle(color: Colors.white38, fontSize: 10),
        ),
      ],
    );
  }
}