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

class FourSwitchsCard extends StatelessWidget {
  final String switch1;
  final String title1;
  final String switch3;
  final String title3;

  final String switch2;
  final String title2;

  final String switch4;
  final String title4;

  final VoidCallback onSwitch1UpTap;
  final VoidCallback onSwitch4DownTap;
  final VoidCallback onSwitch2UpTap;
  final VoidCallback onSwitch3DownTap;

  FourSwitchsCard({
    required this.title1,
    required this.title2,
    required this.title3,
    required this.title4,
    required this.switch3,
    required this.switch1,
    required this.switch4,
    required this.switch2,
    required this.onSwitch1UpTap,
    required this.onSwitch3DownTap,
    required this.onSwitch2UpTap,
    required this.onSwitch4DownTap,
  });

  @override
  Widget build(BuildContext context) {
    return Expanded(
      flex: 4,
      child: InkWell(
        overlayColor: MaterialStateProperty.all(Colors.transparent),
        onTap: () {},
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            Expanded(
              child: Container(
                margin: const EdgeInsets.symmetric(horizontal: 10),
                decoration: const BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.all(Radius.circular(10)),
                ),
                child: Container(
                  margin: const EdgeInsets.symmetric(horizontal: 10),
                  decoration: BoxDecoration(
                    color: ColorsManager.onPrimaryColor,
                    boxShadow: [
                      BoxShadow(
                        color: Colors.white.withOpacity(0.1),
                        blurRadius: 24,
                        offset: const Offset(-2, -2),
                        blurStyle: BlurStyle.outer,
                      ),
                      BoxShadow(
                        color: Colors.black.withOpacity(0.11),
                        blurRadius: 5,
                        offset: const Offset(2, 0),
                        blurStyle: BlurStyle.outer,
                      ),
                      BoxShadow(
                        color: Colors.white.withOpacity(0.13),
                        blurRadius: 10,
                        offset: const Offset(5, 1),
                        blurStyle: BlurStyle.inner,
                      ),
                    ],
                  ),
                  child: SizedBox(
                    height: 300,
                    child: Row(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: [
                        _buildSwitchColumn(
                            switchUp: switch1,
                            switchDown: switch3,
                            onUpTap: onSwitch1UpTap,
                            onDownTap: onSwitch3DownTap,
                            titleDown: title3,
                            titleUp: title1),
                        _buildDivider(),
                        _buildSwitchColumn(
                            titleDown: title4,
                            titleUp: title2,
                            switchUp: switch2,
                            switchDown: switch4,
                            onUpTap: onSwitch2UpTap,
                            onDownTap: onSwitch4DownTap),
                      ],
                    ),
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildSwitchColumn({
    String switchUp = '',
    String switchDown = '',
    String titleUp = '',
    String titleDown = '',
    VoidCallback? onUpTap,
    VoidCallback? onDownTap,
  }) {
    return Expanded(
      child: Padding(
        padding: const EdgeInsets.only(top: 30, bottom: 30),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Column(
              children: [
                InkWell(
                  onTap: onUpTap,
                  child: Container(
                    height: 20,
                    width: 20,
                    child: SvgPicture.asset(switchUp),
                  ),
                ),
                Text(titleUp)
              ],
            ),
            Column(
              children: [
                InkWell(
                  onTap: onDownTap,
                  child: Container(
                    height: 20,
                    width: 20,
                    child: SvgPicture.asset(switchDown),
                  ),
                ),
                Text(titleDown)
              ],
            ),
          ],
        ),
      ),
    );
  }

  Widget _buildDivider() {
    return Container(
      width: 3,
      color: ColorsManager.dividerColor,
    );
  }
}
