import 'package:flutter/material.dart';

import '../l10n/app_localizations.dart';

/// Ekran oranı buton ızgarası: 31 buton `a:b` (a dikeyi, b yatayı böler;
/// hedef boyut `W/b × H/a`). Sol-üst hücre (1:1) boş placeholder — 1:1 yok
/// (title bar çift tık zaten tam ekran).
///
/// Yerleşim: sabit 8 satır × 4 sütun (31-10: geniş/dar transpozesi
/// kaldırıldı — kullanıcı kararı).
class WindowSizeSelector extends StatelessWidget {
  final Future<Size?> Function() workArea;
  final void Function(int rows, int cols, Size work) onPick;

  const WindowSizeSelector({
    super.key,
    required this.workArea,
    required this.onPick,
  });

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisSize: MainAxisSize.min,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(AppLocalizations.of(context)!.sizeSection,
            style: const TextStyle(color: Colors.white70, fontSize: 13)),
        const SizedBox(height: 4),
        SingleChildScrollView(
          scrollDirection: Axis.horizontal,
          child: Column(
            mainAxisSize: MainAxisSize.min,
            children: [for (var b = 1; b <= 8; b++) _row(b)],
          ),
        ),
      ],
    );
  }

  /// Satır = `b` (1..8, yatay bölün); satır içinde `a` (1..4, dikey bölün).
  Widget _row(int b) {
    return Row(
      mainAxisSize: MainAxisSize.min,
      children: [
        for (var a = 1; a <= 4; a++) _cell(a, b),
      ],
    );
  }

  Widget _cell(int a, int b) {
    return Padding(
      padding: const EdgeInsets.only(right: 4, bottom: 4),
      child: a == 1 && b == 1
          ? const SizedBox(width: 46, height: 26)
          : GestureDetector(
              onTap: () async {
                final work = await workArea();
                if (work != null) onPick(a, b, work);
              },
              child: Container(
                width: 46,
                height: 26,
                decoration: BoxDecoration(
                  color: Colors.white10,
                  borderRadius: BorderRadius.circular(4),
                ),
                alignment: Alignment.center,
                child: Text(
                  '$a:$b',
                  style: const TextStyle(color: Colors.white, fontSize: 11),
                ),
              ),
            ),
    );
  }
}