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);

    return Container(
      padding: const EdgeInsets.fromLTRB(16.0, 16.0, 16.0, 27.0),
      decoration: BoxDecoration(
        color: ColorsManager.whiteColors,
        boxShadow: [
          BoxShadow(
            color: ColorsManager.shadowBlackColor,
            blurRadius: 8,
            offset: const Offset(0, 4),
          ),
        ],
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          _buildCommunityInfo(theme),
          _buildActionButtons(),
        ],
      ),
    );
  }

  Widget _buildCommunityInfo(ThemeData theme) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(
          'Community Structure',
          style: theme.textTheme.headlineLarge?.copyWith(color: ColorsManager.blackColor),
        ),
        if (communityName != null) _buildCommunityName(),
      ],
    );
  }

  Widget _buildCommunityName() {
    return Row(
      children: [
        if (!isEditingName)
          Text(
            communityName!,
            style: const TextStyle(fontSize: 16, color: ColorsManager.blackColor),
          ),
        if (isEditingName)
          SizedBox(
            width: 200,
            child: TextField(
              controller: nameController,
              decoration: const InputDecoration(
                border: InputBorder.none,
                isDense: true,
              ),
              style: const TextStyle(fontSize: 16, color: ColorsManager.blackColor),
              onSubmitted: onNameSubmitted,
            ),
          ),
        const SizedBox(width: 8),
        GestureDetector(
          onTap: onEditName,
          child: SvgPicture.asset(
            Assets.iconEdit,
            width: 16,
            height: 16,
          ),
        ),
      ],
    );
  }

  Widget _buildActionButtons() {
    return Row(
      children: [
        if (isSave)
          _buildButton(
            label: "Save",
            icon: const Icon(Icons.save, size: 18, color: ColorsManager.spaceColor),
            onPressed: onSave,
          ),
        if (isSave) const SizedBox(width: 10),
        if (communityName != null && communityName != '')
          _buildButton(
            label: "Delete",
            icon: SvgPicture.asset(
              Assets.delete,
              width: 18,
              height: 18,
            ),
            onPressed: onDelete,
          ),
      ],
    );
  }

  Widget _buildButton({
    required String label,
    required Widget icon,
    required VoidCallback onPressed,
  }) {
    return SizedBox(
      width: 100,
      height: 30,
      child: DefaultButton(
        onPressed: onPressed,
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            icon,
            const SizedBox(width: 8),
            Text(label),
          ],
        ),
        backgroundColor: ColorsManager.textFieldGreyColor,
        foregroundColor: ColorsManager.blackColor,
        borderRadius: 8.0,
        padding: 2.0,
        elevation: 0,
        borderColor: Colors.grey.shade300,
      ),
    );
  }
}