import 'package:flutter/material.dart';
import 'package:marco/helpers/widgets/my_spacing.dart';
import 'package:marco/helpers/widgets/my_text.dart';
import 'package:marco/helpers/utils/mixins/ui_mixin.dart';

class BaseBottomSheet extends StatefulWidget {
  final String title;
  final String? subtitle;
  final Widget child;
  final VoidCallback onCancel;
  final VoidCallback onSubmit;
  final bool isSubmitting;
  final String submitText;
  final Color? submitColor;
  final IconData submitIcon;
  final bool showButtons;
  final Widget? bottomContent;

  const BaseBottomSheet({
    super.key,
    required this.title,
    required this.child,
    required this.onCancel,
    required this.onSubmit,
    this.subtitle,
    this.isSubmitting = false,
    this.submitText = 'Submit',
    this.submitColor,
    this.submitIcon = Icons.check_circle_outline,
    this.showButtons = true,
    this.bottomContent,
  });

  @override
  State<BaseBottomSheet> createState() => _BaseBottomSheetState();
}

class _BaseBottomSheetState extends State<BaseBottomSheet> with UIMixin {
  @override
  Widget build(BuildContext context) {
    final theme = Theme.of(context);
    final mediaQuery = MediaQuery.of(context);
    final effectiveSubmitColor =
        widget.submitColor ?? contentTheme.primary;

    return SingleChildScrollView(
      padding: mediaQuery.viewInsets,
      child: Padding(
        padding: const EdgeInsets.only(top: 60),
        child: Container(
          decoration: BoxDecoration(
            color: theme.cardColor,
            borderRadius: const BorderRadius.vertical(top: Radius.circular(24)),
            boxShadow: const [
              BoxShadow(
                color: Colors.black12,
                blurRadius: 12,
                offset: Offset(0, -2),
              ),
            ],
          ),
          child: SafeArea(
            top: false,
            child: Padding(
              padding: const EdgeInsets.fromLTRB(20, 16, 20, 32),
              child: Column(
                mainAxisSize: MainAxisSize.min,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  MySpacing.height(5),
                  Center(
                    child: Container(
                      width: 40,
                      height: 5,
                      decoration: BoxDecoration(
                        color: Colors.grey.shade300,
                        borderRadius: BorderRadius.circular(10),
                      ),
                    ),
                  ),
                  MySpacing.height(12),
                  Center(
                    child: MyText.titleLarge(
                      widget.title,
                      fontWeight: 700,
                      textAlign: TextAlign.center,
                    ),
                  ),
                  if (widget.subtitle != null &&
                      widget.subtitle!.isNotEmpty) ...[
                    MySpacing.height(4),
                    MyText.bodySmall(
                      widget.subtitle!,
                      fontWeight: 600,
                      color: Colors.grey[700],
                    ),
                  ],
                  MySpacing.height(12),
                  widget.child,
                  MySpacing.height(12),
                  if (widget.showButtons) ...[
                    Row(
                      children: [
                        Expanded(
                          child: ElevatedButton.icon(
                            onPressed: widget.onCancel,
                            icon: const Icon(Icons.close, color: Colors.white),
                            label: MyText.bodyMedium(
                              "Cancel",
                              color: Colors.white,
                              fontWeight: 600,
                            ),
                            style: ElevatedButton.styleFrom(
                              backgroundColor: Colors.grey,
                              shape: RoundedRectangleBorder(
                                borderRadius: BorderRadius.circular(12),
                              ),
                              padding:
                                  const EdgeInsets.symmetric(vertical: 8),
                            ),
                          ),
                        ),
                        const SizedBox(width: 12),
                        Expanded(
                          child: ElevatedButton.icon(
                            onPressed:
                                widget.isSubmitting ? null : widget.onSubmit,
                            icon:
                                Icon(widget.submitIcon, color: Colors.white),
                            label: MyText.bodyMedium(
                              widget.isSubmitting
                                  ? "Submitting..."
                                  : widget.submitText,
                              color: Colors.white,
                              fontWeight: 600,
                            ),
                            style: ElevatedButton.styleFrom(
                              backgroundColor: effectiveSubmitColor,
                              shape: RoundedRectangleBorder(
                                borderRadius: BorderRadius.circular(12),
                              ),
                              padding:
                                  const EdgeInsets.symmetric(vertical: 8),
                            ),
                          ),
                        ),
                      ],
                    ),
                    if (widget.bottomContent != null) ...[
                      MySpacing.height(12),
                      widget.bottomContent!,
                    ],
                  ],
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}