syncrow-app/lib/features/scene/view/settings/wind_speed_dialog.dart

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

class WindSpeedDialog extends StatefulWidget {
  final Function(double selectedTemperature, int selectedToggleIndex,
      String selectedCity)? confirmTab;

  const WindSpeedDialog({
    Key? key,
    this.confirmTab,
  }) : super(key: key);

  @override
  _WindSpeedDialogState createState() => _WindSpeedDialogState();
}

class _WindSpeedDialogState extends State<WindSpeedDialog> {
  double _currentSpeed = 40;
  String _selectedCity = 'Current City';
  int selectedToggleIndex = 1;

  @override
  Widget build(BuildContext context) {
    return Dialog(
      backgroundColor: Colors.white,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20.0)),
      child: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          const SizedBox(height: 10),
          Text(
            'Wind Speed',
            style: TextStyle(
                fontSize: 20,
                fontWeight: FontWeight.w700,
                color: ColorsManager.primaryColor.withOpacity(0.5)),
          ),
          const Divider(color: ColorsManager.greyColor),
          ToggleButtons(
            isSelected: [
              selectedToggleIndex == 0,
              selectedToggleIndex == 1,
              selectedToggleIndex == 2
            ],
            onPressed: (index) {
              setState(() {
                selectedToggleIndex = index;
              });
            },
            borderRadius: BorderRadius.circular(30),
            selectedColor: Colors.white,
            color: ColorsManager.blackColor,
            fillColor: ColorsManager.primaryColorWithOpacity,
            borderColor: ColorsManager.greyColor,
            constraints: BoxConstraints.tight(const Size(70, 30)),
            children: [
              _buildToggleOption('<', selectedToggleIndex == 0),
              _buildToggleOption('=', selectedToggleIndex == 1),
              _buildToggleOption('>', selectedToggleIndex == 2),
            ],
          ),
          const SizedBox(height: 10),
          Text(
            '${_currentSpeed.toStringAsFixed(0)} m/s',
            style: TextStyle(
                fontSize: 40,
                fontWeight: FontWeight.bold,
                color: ColorsManager.secondaryColor.withOpacity(0.5)),
          ),
          Slider(
            activeColor: ColorsManager.secondaryColor.withOpacity(0.5),
            inactiveColor: ColorsManager.grayBox,
            thumbColor: ColorsManager.primaryColor,
            value: _currentSpeed,
            min: 0,
            max: 62,
            onChanged: (value) {
              setState(() {
                _currentSpeed = value;
              });
            },
          ),
          ElevatedButton(
            onPressed: _selectCity,
            child: Text(
              _selectedCity,
              style: const TextStyle(
                  color: ColorsManager.grayColor,
                  fontSize: 14,
                  fontWeight: FontWeight.w400),
            ),
            style: ElevatedButton.styleFrom(
              backgroundColor: ColorsManager.grayBox.withOpacity(0.6),
            ),
          ),
          const SizedBox(height: 20),
          Row(
            children: [
              _buildActionButton(context, 'Cancel', ColorsManager.textGray,
                  () => Navigator.of(context).pop()),
              _buildActionButton(context, 'Confirm', ColorsManager.primaryColor,
                  () {
                widget.confirmTab!
                    .call(_currentSpeed, selectedToggleIndex, _selectedCity);
              }),
            ],
          )
        ],
      ),
    );
  }

  Widget _buildToggleOption(String label, bool isSelected) {
    return SizedBox(
      width: 70,
      height: 30,
      child: Container(
        alignment: Alignment.center,
        color: isSelected
            ? ColorsManager.secondaryColor.withOpacity(0.2)
            : ColorsManager.textGray,
        child: Text(label),
      ),
    );
  }

  Widget _buildActionButton(
      BuildContext context, String text, Color color, VoidCallback onTap) {
    return Expanded(
      child: InkWell(
        onTap: onTap,
        child: Container(
          padding: const EdgeInsets.all(15),
          decoration: BoxDecoration(
            border: Border(
              top: const BorderSide(color: ColorsManager.textGray),
              left: text == 'Confirm'
                  ? const BorderSide(color: ColorsManager.textGray, width: 0.5)
                  : BorderSide.none,
            ),
          ),
          child: Center(
            child: Text(
              text,
              style: TextStyle(
                  color: color, fontSize: 14, fontWeight: FontWeight.w400),
            ),
          ),
        ),
      ),
    );
  }

  void _selectCity() {
    // Placeholder for the city selection function
    setState(() {
      _selectedCity = 'Selected City';
    });
  }
}