import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:hadi_hoda_flutter/common_ui/resources/my_assets.dart';
import 'package:hadi_hoda_flutter/common_ui/resources/my_colors.dart';
import 'package:hadi_hoda_flutter/common_ui/resources/my_spaces.dart';
import 'package:hadi_hoda_flutter/common_ui/resources/my_text_style.dart';
import 'package:hadi_hoda_flutter/core/utils/my_image.dart';
import 'package:hadi_hoda_flutter/core/utils/my_localization.dart';
import 'package:hadi_hoda_flutter/core/utils/screen_size.dart';
import 'package:hadi_hoda_flutter/core/widgets/button/my_button.dart';
import 'package:hadi_hoda_flutter/features/language/presentation/bloc/language_bloc.dart';
import 'package:hadi_hoda_flutter/features/language/presentation/bloc/language_event.dart';
import 'package:hadi_hoda_flutter/features/language/presentation/bloc/language_state.dart';

class LanguagePage extends StatelessWidget {
  const LanguagePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        height: context.heightScreen,
        width: context.widthScreen,
        decoration: BoxDecoration(
          gradient: LinearGradient(
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter,
            colors: [Color(0XFF00154C), Color(0XFF150532)],
          ),
          image: DecorationImage(
            image: AssetImage(MyAssets.pattern),
            scale: 3,
            repeat: ImageRepeat.repeat,
            colorFilter: ColorFilter.mode(
              Colors.white.withValues(alpha: 0.2),
              BlendMode.srcIn,
            ),
          ),
        ),
        child: Padding(
          padding: EdgeInsets.only(
            left: 60,
            right: 60,
            bottom: MediaQuery.viewPaddingOf(context).bottom + MySpaces.s16,
            top: MediaQuery.viewPaddingOf(context).bottom + 50,
          ),
          child: Column(
            children: [_title(context), _list(context), _btn(context)],
          ),
        ),
      ),
    );
  }

  Widget _title(BuildContext context) {
    return Row(
      spacing: MySpaces.s10,
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        MyImage(image: MyAssets.lang, size: 28),
        Text(
          context.translate.select_language,
          style: Marhey.semiBold22.copyWith(color: Color(0XFF847AC4)),
        ),
      ],
    );
  }

  Expanded _list(BuildContext context) {
    return Expanded(
      child: Material(
        color: MyColors.transparent,
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: List.generate(
            context.read<LanguageBloc>().languages.length,
            (index) => BlocBuilder<LanguageBloc, LanguageState>(
                buildWhen: (previous, current) =>
                previous.selectedLang.code != current.selectedLang.code,
                builder: (context, state) {
                  final LanguageBloc languageBloc = context.read<LanguageBloc>();
                  return ListTile(
                    selected: state.selectedLang.code ==
                        languageBloc.languages[index].code,
                    onTap: () {
                      languageBloc.add(
                          ChangeLanguageEvent(languageBloc.languages[index]));
                    },
                    title: Text(context.read<LanguageBloc>().languages[index].title ?? ''),
                    titleTextStyle: Marhey.medium16.copyWith(
                      color: MyColors.white,
                    ),
                    contentPadding: EdgeInsets.symmetric(
                      vertical: MySpaces.s12,
                      horizontal: 30,
                    ),
                    minVerticalPadding: 0,
                    minTileHeight: 0,
                    minLeadingWidth: 0,
                    horizontalTitleGap: MySpaces.s12,
                    leading:  state.selectedLang.code ==
                        languageBloc.languages[index].code ? Container(
                      height: 17,
                      width: 17,
                      padding: EdgeInsets.all(3),
                      decoration: BoxDecoration(
                        shape: BoxShape.circle,
                        border: Border.all(
                          width: 1,
                          color: Color(0XFF3CFF3C),
                        ),
                        gradient: LinearGradient(
                          begin: Alignment.topCenter,
                          end: Alignment.bottomCenter,
                          colors: [
                            Color(0XFF48D336),
                            Color(0XFF2D7C23),
                          ],
                        ),
                      ),
                      child: MyImage(image: MyAssets.doneRounded),
                    ) : SizedBox(height: 17, width: 17),
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.all(Radius.circular(12)),
                    ),
                    selectedTileColor: MyColors.white.withValues(alpha: 0.2),
                    selectedColor: MyColors.white,
                  );
                }
            ),
          ),
        ),
      ),
    );
  }

  Widget _btn(BuildContext context) {
    return MyButton(
      onTap: () => context.read<LanguageBloc>().add(SaveLevelsEvent()),
      title: context.translate.select,
    );
  }
}