import 'package:flutter/material.dart';

import '../../../../l10n/app_localizations.dart';
import '../../../../shared/theme/design_tokens.dart';
import '../widgets/settings_section_widgets.dart';

class LanguageSettingsScreen extends StatelessWidget {
  const LanguageSettingsScreen({super.key, required this.selectedLanguageTag});

  final String selectedLanguageTag;

  @override
  Widget build(BuildContext context) {
    final l10n = AppLocalizations.of(context)!;
    final colors = Theme.of(context).colorScheme;
    final options = <({String tag, String label})>[
      (tag: 'zh-CN', label: l10n.chinese),
      (tag: 'en-US', label: l10n.english),
    ];

    return Scaffold(
      backgroundColor: colors.surfaceContainerLow,
      appBar: AppBar(
        title: Text(l10n.language),
        centerTitle: true,
        backgroundColor: colors.surfaceContainerLow,
        surfaceTintColor: colors.surfaceContainerLow,
      ),
      body: ListView(
        padding: const EdgeInsets.all(AppSpacing.lg),
        children: [
          SectionLabel(text: l10n.settingsLanguageSection),
          SettingsGroupCard(
            children: [
              for (int i = 0; i < options.length; i++)
                SettingsMenuTile(
                  icon: Icons.language_rounded,
                  title: options[i].label,
                  subtitle: options[i].tag,
                  tint: colors.primary,
                  background: colors.surfaceContainerHighest,
                  showDivider: i != options.length - 1,
                  trailing: selectedLanguageTag == options[i].tag
                      ? Icon(Icons.check_rounded, color: colors.primary)
                      : Icon(
                          Icons.chevron_right_rounded,
                          color: colors.outline,
                        ),
                  onTap: () => Navigator.of(context).pop(options[i].tag),
                ),
            ],
          ),
        ],
      ),
    );
  }
}