// ABOUTME: Settings section widget for grouping related settings with descriptive headers
// ABOUTME: Provides consistent styling and organization for settings groups with accessibility support
import 'package:flutter/material.dart';

/// Widget for organizing settings into labeled sections
class SettingSection extends StatelessWidget {
  final String title;
  final String? subtitle;
  final List<Widget> children;
  final EdgeInsetsGeometry? padding;
  final bool showDividers;

  const SettingSection({
    super.key,
    required this.title,
    this.subtitle,
    required this.children,
    this.padding,
    this.showDividers = false,
  });

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        // Section header
        Padding(
          padding: padding ?? const EdgeInsets.only(left: 16, right: 16, bottom: 8),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(
                title,
                style: Theme.of(context).textTheme.titleMedium?.copyWith(
                  color: Theme.of(context).colorScheme.primary,
                  fontWeight: FontWeight.w600,
                ),
              ),
              if (subtitle != null) ...[
                const SizedBox(height: 4),
                Text(
                  subtitle!,
                  style: Theme.of(context).textTheme.bodySmall?.copyWith(
                    color: Theme.of(context).colorScheme.onSurfaceVariant,
                  ),
                ),
              ],
            ],
          ),
        ),

        // Settings content in a card
        Card(
          margin: const EdgeInsets.symmetric(horizontal: 16),
          child: showDividers ? _buildWithDividers(context) : _buildWithoutDividers(),
        ),
      ],
    );
  }

  Widget _buildWithDividers(BuildContext context) {
    return Column(
      children: _addDividers(context),
    );
  }

  Widget _buildWithoutDividers() {
    return Column(children: children);
  }

  List<Widget> _addDividers(BuildContext context) {
    if (children.isEmpty) return [];

    final List<Widget> dividedChildren = [children.first];

    for (int i = 1; i < children.length; i++) {
      dividedChildren.add(
        Divider(
          height: 1,
          thickness: 1,
          color: Theme.of(context).dividerColor.withOpacity(0.2),
        ),
      );
      dividedChildren.add(children[i]);
    }

    return dividedChildren;
  }
}

/// Compact version for smaller sections
class CompactSettingSection extends SettingSection {
  const CompactSettingSection({
    super.key,
    required super.title,
    super.subtitle,
    required super.children,
    super.showDividers = true,
  }) : super(
          padding: const EdgeInsets.only(left: 16, right: 16, bottom: 4),
        );

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.only(bottom: 16),
      child: super.build(context),
    );
  }
}
