syncrow-web/lib/pages/spaces_management/widgets/community_stricture_header_widget.dart

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: [
              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.3,
                  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: 8),
              GestureDetector(
                onTap: onEditName,
                child: SvgPicture.asset(
                  Assets.iconEdit,
                  width: 16,
                  height: 16,
                ),
              ),
              const Spacer(flex: 3), // Pushes the Save button to the right
              if (isSave) _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,
              ),
            ),
          ],
        ),
      ),
    );
  }
}