syncrow-app/lib/features/devices/view/widgets/restart_status_dialog.dart

import 'package:flutter/material.dart';
import 'package:syncrow_app/features/shared_widgets/text_widgets/body_large.dart';
import 'package:syncrow_app/features/shared_widgets/text_widgets/body_medium.dart';
import 'package:syncrow_app/utils/resource_manager/color_manager.dart';

class RestartStatusDialog extends StatefulWidget {
  final String label1;
  final String label2;
  final String label3;
  final String title;

  final Function(String)? onTapLabel1;
  final Function(String)? onTapLabel2;
  final Function(String)? onTapLabel3;
  final Function()? cancelTab;
  final Function()? confirmTab;

  final String? initialSelectedLabel;

  RestartStatusDialog({
    required this.label1,
    required this.label2,
    required this.label3,
    required this.title,
    this.onTapLabel1,
    this.onTapLabel2,
    this.onTapLabel3,
    required this.cancelTab,
    required this.confirmTab,
    this.initialSelectedLabel,
  });

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

class _RestartStatusDialogState extends State<RestartStatusDialog> {
  late String _selectedOption;

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

    _selectedOption = widget.initialSelectedLabel ?? '';
  }

  @override
  Widget build(BuildContext context) {
    return AlertDialog(
      contentPadding: EdgeInsets.zero,
      content: Column(
        mainAxisSize: MainAxisSize.min,
        children: <Widget>[
          const SizedBox(
            height: 10,
          ),
          BodyLarge(
            text: widget.title,
            fontWeight: FontWeight.w700,
            fontColor: ColorsManager.primaryColor,
            fontSize: 16,
          ),
          const Padding(
            padding: EdgeInsets.only(left: 15, right: 15),
            child: Divider(
              color: ColorsManager.textGray,
            ),
          ),
          Padding(
            padding: const EdgeInsets.only(left: 15, right: 15),
            child: Column(
              children: [
                _buildCheckboxOption(
                  label: widget.label1,
                  onTap: widget.onTapLabel1,
                ),
                _buildCheckboxOption(
                  label: widget.label2,
                  onTap: widget.onTapLabel2,
                ),
                _buildCheckboxOption(
                  label: widget.label3,
                  onTap: widget.onTapLabel3,
                ),
              ],
            ),
          ),
          Row(
            children: [
              Expanded(
                child: Container(
                  decoration: const BoxDecoration(
                      border: Border(
                    right: BorderSide(
                      color: ColorsManager.textGray,
                      width: 0.5,
                    ),
                    top: BorderSide(
                      color: ColorsManager.textGray,
                      width: 1.0,
                    ),
                  )),
                  child: SizedBox(
                    child: InkWell(
                      onTap: widget.cancelTab,
                      child: const Padding(
                        padding: EdgeInsets.all(15),
                        child: Center(
                          child: Text(
                            'Cancel',
                            style: TextStyle(
                                color: ColorsManager.textGray,
                                fontSize: 14,
                                fontWeight: FontWeight.w400),
                          ),
                        ),
                      ),
                    ),
                  ),
                ),
              ),
              Expanded(
                  child: Container(
                decoration: const BoxDecoration(
                    border: Border(
                  left: BorderSide(
                    color: ColorsManager.textGray,
                    width: 0.5,
                  ),
                  top: BorderSide(
                    color: ColorsManager.textGray,
                    width: 1.0,
                  ),
                )),
                child: InkWell(
                    onTap: widget.confirmTab,
                    child: const Padding(
                      padding: EdgeInsets.all(15),
                      child: Center(
                        child: Text(
                          'Confirm',
                          style: TextStyle(
                              color: ColorsManager.primaryColor,
                              fontSize: 14,
                              fontWeight: FontWeight.w400),
                        ),
                      ),
                    )),
              ))
            ],
          )
        ],
      ),
    );
  }

  Widget _buildCheckboxOption(
      {required String label, Function(String)? onTap}) {
    return Padding(
      padding: const EdgeInsets.only(bottom: 10, top: 10),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          BodyMedium(
            text: label,
            style: const TextStyle(fontSize: 15, fontWeight: FontWeight.w400),
          ),
          CircularCheckbox(
            value: _selectedOption == label,
            onChanged: (bool? value) {
              if (value == true) {
                setState(() {
                  _selectedOption = label;
                });
                if (onTap != null) {
                  onTap(label);
                }
              }
            },
          ),
        ],
      ),
    );
  }
}

class CircularCheckbox extends StatefulWidget {
  final bool value;
  final ValueChanged<bool?> onChanged;

  CircularCheckbox({required this.value, required this.onChanged});

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

class _CircularCheckboxState extends State<CircularCheckbox> {
  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: () {
        widget.onChanged(!widget.value);
      },
      child: Container(
        decoration: BoxDecoration(
          shape: BoxShape.circle,
          border: Border.all(
            color: widget.value
                ? ColorsManager.primaryColorWithOpacity.withOpacity(0.01)
                : Colors.grey,
            width: 2.0,
          ),
          color: widget.value
              ? ColorsManager.primaryColorWithOpacity
              : Colors.transparent,
        ),
        width: 24.0,
        height: 24.0,
        child: widget.value
            ? const Icon(
                Icons.check,
                color: Colors.white,
                size: 16.0,
              )
            : null,
      ),
    );
  }
}