import 'package:flutter/cupertino.dart';
import 'package:please_pay_me/theme/tokens.dart';
import 'package:please_pay_me/ui/atoms/app_text.dart';

/// Single row of an inset-grouped list (Settings-style).
class AppListTile extends StatefulWidget {
  const AppListTile({
    super.key,
    required this.title,
    this.subtitle,
    this.leading,
    this.value,
    this.trailing,
    this.onTap,
    this.showChevron = true,
    this.destructive = false,
  });

  final String title;
  final String? subtitle;
  final Widget? leading;

  /// Secondary gray text aligned to the right (iOS `additionalInfo`).
  final String? value;

  /// Custom trailing widget — replaces [value] and the chevron.
  final Widget? trailing;

  final VoidCallback? onTap;
  final bool showChevron;
  final bool destructive;

  @override
  State<AppListTile> createState() => _AppListTileState();
}

class _AppListTileState extends State<AppListTile> {
  bool _pressed = false;

  @override
  Widget build(BuildContext context) {
    final tappable = widget.onTap != null;

    final row = Container(
      color: _pressed
          ? AppColors.of(context, AppColors.systemGray5)
          : AppColors.of(context, AppColors.groupedSurface),
      constraints: const BoxConstraints(minHeight: AppSizes.rowMinHeight),
      padding: const EdgeInsets.symmetric(
        horizontal: AppSpacing.gutter,
        vertical: AppSpacing.s2 + 2,
      ),
      child: Row(
        children: [
          if (widget.leading != null) ...[
            widget.leading!,
            const SizedBox(width: AppSpacing.s3),
          ],
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                AppText.body(
                  widget.title,
                  color: widget.destructive ? AppColors.systemRed : AppColors.label,
                  maxLines: 1,
                  overflow: TextOverflow.ellipsis,
                ),
                if (widget.subtitle != null) ...[
                  const SizedBox(height: 2),
                  AppText.footnote(widget.subtitle!, maxLines: 2, overflow: TextOverflow.ellipsis),
                ],
              ],
            ),
          ),
          if (widget.trailing != null)
            widget.trailing!
          else ...[
            if (widget.value != null)
              Padding(
                padding: const EdgeInsets.only(left: AppSpacing.s2),
                child: AppText.body(widget.value!, color: AppColors.secondaryLabel),
              ),
            if (tappable && widget.showChevron)
              Padding(
                padding: const EdgeInsets.only(left: AppSpacing.s1),
                child: Icon(
                  CupertinoIcons.chevron_forward,
                  size: 16,
                  color: AppColors.of(context, AppColors.tertiaryLabel),
                ),
              ),
          ],
        ],
      ),
    );

    if (!tappable) return row;

    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: widget.onTap,
      onTapDown: (_) => setState(() => _pressed = true),
      onTapUp: (_) => setState(() => _pressed = false),
      onTapCancel: () => setState(() => _pressed = false),
      child: row,
    );
  }
}