import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:syncrow_web/pages/common/buttons/default_button.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/constants/assets.dart';

class CommunityStructureHeader extends StatelessWidget {
  final String? communityName;
  final bool isEditingName;
  final bool isSave;
  final TextEditingController nameController;
  final VoidCallback onSave;
  final VoidCallback onDelete;
  final VoidCallback onEditName;
  final ValueChanged<String> onNameSubmitted;

  const CommunityStructureHeader({
    Key? key,
    required this.communityName,
    required this.isSave,
    required this.isEditingName,
    required this.nameController,
    required this.onSave,
    required this.onDelete,
    required this.onEditName,
    required this.onNameSubmitted,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final theme = Theme.of(context);
    final screenWidth = MediaQuery.of(context).size.width;

    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 16.0),
      decoration: BoxDecoration(
        color: ColorsManager.whiteColors,
        boxShadow: [
          BoxShadow(
            color: ColorsManager.shadowBlackColor,
            blurRadius: 8,
            offset: const Offset(0, 4),
          ),
        ],
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Expanded(
                child: _buildCommunityInfo(theme, screenWidth),
              ),
              const SizedBox(width: 16),
            ],
          ),
        ],
      ),
    );
  }

  Widget _buildCommunityInfo(ThemeData theme, double screenWidth) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          'Community Structure',
          style: theme.textTheme.headlineLarge?.copyWith(color: ColorsManager.blackColor),
        ),
        if (communityName != null)
          Row(
            children: [
              Expanded(
                child: Row(
                  children: [
                    if (!isEditingName)
                      Flexible(
                        child: Text(
                          communityName!,
                          style:
                              theme.textTheme.bodyLarge?.copyWith(color: ColorsManager.blackColor),
                          overflow: TextOverflow.ellipsis,
                          maxLines: 1,
                        ),
                      ),
                    if (isEditingName)
                      SizedBox(
                        width: screenWidth * 0.1,
                        child: TextField(
                          controller: nameController,
                          decoration: const InputDecoration(
                            border: InputBorder.none,
                            isDense: true,
                          ),
                          style:
                              theme.textTheme.bodyLarge?.copyWith(color: ColorsManager.blackColor),
                          onSubmitted: onNameSubmitted,
                        ),
                      ),
                    const SizedBox(width: 2),
                    GestureDetector(
                      onTap: onEditName,
                      child: SvgPicture.asset(
                        Assets.iconEdit,
                        width: 16,
                        height: 16,
                      ),
                    ),
                  ],
                ),
              ),
              if (isSave) ...[
                const SizedBox(width: 8),
                _buildActionButtons(theme),
              ],
            ],
          ),
      ],
    );
  }

  Widget _buildActionButtons(ThemeData theme) {
    return Wrap(
      alignment: WrapAlignment.end,
      spacing: 10,
      children: [
        _buildButton(
            label: "Save",
            icon: const Icon(Icons.save, size: 18, color: ColorsManager.spaceColor),
            onPressed: onSave,
            theme: theme),
      ],
    );
  }

  Widget _buildButton(
      {required String label,
      required Widget icon,
      required VoidCallback onPressed,
      required ThemeData theme}) {
    const double buttonHeight = 30;
    return ConstrainedBox(
      constraints: BoxConstraints(maxWidth: 80, minHeight: buttonHeight),
      child: DefaultButton(
        onPressed: onPressed,
        backgroundColor: ColorsManager.textFieldGreyColor,
        foregroundColor: ColorsManager.blackColor,
        borderRadius: 8.0,
        padding: 2.0,
        height: buttonHeight,
        elevation: 0,
        borderColor: Colors.grey.shade300,
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            icon,
            const SizedBox(width: 5),
            Flexible(
              child: Text(
                label,
                style: theme.textTheme.bodySmall?.copyWith(color: ColorsManager.blackColor),
                overflow: TextOverflow.ellipsis,
                maxLines: 1,
              ),
            ),
          ],
        ),
      ),
    );
  }
}