import 'package:flutter/cupertino.dart';
import 'package:hum/core/constants/app_icons.dart';
import 'package:hum/core/constants/app_theme.dart';
import 'package:hum/widgets/widget_buttons.dart';

class BTNCategory extends StatelessWidget {
  final String label;
  final String icon;

  const BTNCategory({required this.label, required this.icon, super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        border: Border.all(
          color: CupertinoDynamicColor.resolve(
            colorCategoryButtonBG,
            context,
          ).withValues(alpha: 0.2),
          width: 1.5,
        ),
        borderRadius: BorderRadius.circular(8),
      ),
      child: CupertinoButton(
        minimumSize: Size(0, categoryHeight),
        color: CupertinoDynamicColor.resolve(colorCategoryButtonBG, context).withValues(alpha: .3),
        borderRadius: BorderRadius.circular(8),
        padding: EdgeInsets.zero,
        onPressed: () {},
        child: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 9.0),
          child: Row(
            spacing: 4,
            children: [
              Icon(
                size: 14,
                color: CupertinoDynamicColor.resolve(colorCategoryButtonFG, context),
                CupertinoIconHelper.fromString(icon),
              ),
              Text(
                label,
                style: TextStyle(
                  fontSize: 14,
                  color: CupertinoDynamicColor.resolve(colorCategoryButtonFG, context),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

class BTNViewSwitcher extends StatelessWidget {
  final List<MenuAction> actions;
  final String view;
  // final double iconSize;
  // final EdgeInsetsGeometry padding;

  const BTNViewSwitcher({super.key, this.view = 'ai', required this.actions});

  @override
  Widget build(BuildContext context) {
    return CupertinoButton(
      key: UniqueKey(),
      child: Icon(CupertinoIcons.ellipsis_vertical),
      onPressed: () => _showMenu(context),
    );
  }

  void _showMenu(BuildContext context) {
    showCupertinoModalPopup<void>(
      context: context,
      builder: (ctx) => CupertinoActionSheet(
        actions: actions.map((a) {
          final row = Row(
            spacing: 12,
            mainAxisAlignment: MainAxisAlignment.start,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Padding(
                padding: const EdgeInsets.only(left: 8.0),
                child: Icon(a.icon, size: 20, color: colorBarButton),
              ),

              Text(a.label, style: TextStyle(color: CupertinoColors.lightBackgroundGray)),
            ],
          );
          return CupertinoActionSheetAction(
            isDestructiveAction: a.destructive,
            onPressed: () {
              Navigator.of(ctx).pop();
              a.onPressed();
            },
            child: row,
          );
        }).toList(),
        cancelButton: CupertinoActionSheetAction(
          onPressed: () => Navigator.of(ctx).pop(),
          isDefaultAction: true,
          child: const Text('Cancel'),
        ),
      ),
    );
  }
}

// TOGGLE TO CHANGE VIEW MODE
class HomeToggleView extends StatefulWidget {
  const HomeToggleView({super.key, this.mode = 'grid', required this.onChanged});

  final String mode;
  final ValueChanged<String> onChanged;

  @override
  State<HomeToggleView> createState() => _HomeToggleViewState();
}

class _HomeToggleViewState extends State<HomeToggleView> {
  String mode = 'grid';

  @override
  void initState() {
    mode = widget.mode;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      child: Container(
        padding: EdgeInsets.all(3),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.all(Radius.circular(14)),
          color: CupertinoDynamicColor.resolve(colorBackground, context),
        ),
        child: Row(
          mainAxisSize: MainAxisSize.min,
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisAlignment: MainAxisAlignment.end,
          children: [
            SizedBox(
              width: 40,
              height: 36,
              child: CupertinoButton.filled(
                color: mode == 'ai'
                    ? CupertinoDynamicColor.resolve(colorBarButton, context)
                    : CupertinoDynamicColor.resolve(colorBackground, context),

                padding: EdgeInsets.zero,
                child: Text(
                  'AI',
                  style: TextStyle(fontWeight: mode == 'ai' ? FontWeight.bold : FontWeight.w300),
                ),
                onPressed: () {
                  setState(() {
                    mode = 'ai';
                  });
                  widget.onChanged('ai');
                },
              ),
            ),
            SizedBox(
              width: 40,
              height: 36,
              child: CupertinoButton.filled(
                color: mode == 'grid'
                    ? CupertinoDynamicColor.resolve(colorBarButton, context)
                    : CupertinoDynamicColor.resolve(colorBackground, context),

                padding: EdgeInsets.zero,
                child: Icon(
                  mode == 'grid'
                      ? CupertinoIcons.square_grid_2x2_fill
                      : CupertinoIcons.square_grid_2x2,
                ),
                onPressed: () {
                  setState(() {
                    mode = 'grid';
                  });
                  widget.onChanged('grid');
                },
              ),
            ),

            // SizedBox(
            //   width: 40,
            //   height: 36,
            //   child: CupertinoButton.filled(
            //     color: mode == 'map'
            //         ? CupertinoDynamicColor.resolve(colorBarButton, context)
            //         : CupertinoDynamicColor.resolve(colorBackground, context),

            //     padding: EdgeInsets.zero,
            //     child: Icon(mode == 'map' ? CupertinoIcons.map_fill : CupertinoIcons.map),
            //     onPressed: () {
            //       setState(() {
            //         mode = 'map';
            //       });
            //       widget.onChanged('map');
            //     },
            //   ),
            // ),
          ],
        ),
      ),
    );
  }
}