import 'package:flutter/material.dart';

import 'package:dotted_border/dotted_border.dart';

import 'package:pweb/controllers/payouts/multiple_payouts.dart';

import 'package:pweb/generated/i18n/app_localizations.dart';


class UploadDropZone extends StatelessWidget {
  const UploadDropZone({
    super.key,
    required this.controller,
  });

  final MultiplePayoutsController controller;

  static const double _panelRadius = 12;

  @override
  Widget build(BuildContext context) {
    final theme = Theme.of(context);
    final l10n = AppLocalizations.of(context)!;
    final hasFile = controller.selectedFileName != null;
    final borderRadius = BorderRadius.circular(_panelRadius);
    final borderColor = theme.colorScheme.outlineVariant.withValues(
      alpha: hasFile ? 0.55 : 1,
    );
    final surfaceColor = theme.colorScheme.surfaceContainerHighest.withValues(
      alpha: hasFile ? 0.2 : 0.35,
    );
    final iconColor = hasFile
        ? theme.colorScheme.onSurfaceVariant
        : theme.colorScheme.primary;

    return ClipRRect(
      borderRadius: borderRadius,
      child: DottedBorder(
        options: RoundedRectDottedBorderOptions(
          radius: Radius.circular(_panelRadius),
          dashPattern: const [8, 5],
          strokeWidth: 1.4,
          color: borderColor,
        ),
        child: Material(
          color: surfaceColor,
          child: InkWell(
            onTap: controller.isBusy
                ? null
                : () => controller.pickAndQuote(),
            borderRadius: borderRadius,
            child: SizedBox(
              width: double.infinity,
              child: Padding(
                padding: const EdgeInsets.symmetric(
                  horizontal: 18,
                  vertical: 16,
                ),
                child: Column(
                  children: [
                    Icon(
                      Icons.upload_file,
                      size: 34,
                      color: iconColor,
                    ),
                    const SizedBox(height: 8),
                    Text(
                      hasFile
                          ? controller.selectedFileName!
                          : l10n.uploadCSV,
                      style: theme.textTheme.bodyMedium?.copyWith(
                        fontWeight: FontWeight.w600,
                      ),
                      textAlign: TextAlign.center,
                    ),
                    const SizedBox(height: 6),
                    Text(
                      l10n.hintUpload,
                      style: theme.textTheme.bodySmall,
                      textAlign: TextAlign.center,
                    ),
                    if (hasFile) ...[
                      const SizedBox(height: 6),
                      Text(
                        '${l10n.payout}: ${controller.rows.length}',
                        style: theme.textTheme.labelMedium?.copyWith(
                          color: theme.colorScheme.onSurfaceVariant,
                        ),
                      ),
                    ],
                  ],
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
}
