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_localization.dart';
import 'package:hadi_hoda_flutter/core/utils/screen_size.dart';
import 'package:hadi_hoda_flutter/core/utils/set_platform_size.dart';
import 'package:hadi_hoda_flutter/core/widgets/button/my_blue_button.dart';
import 'package:hadi_hoda_flutter/core/widgets/images/my_image.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';
import 'package:hadi_hoda_flutter/features/language/presentation/ui/widgets/language_widget.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: setSize(context: context, mobile: 60, tablet: 0.3.w) ?? 0,
            right: setSize(context: context, mobile: 60, tablet: 0.3.w) ?? 0,
            bottom: MySpaces.s40,
            top: 100,
          ),
          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: MYTextStyle.titr0.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 LanguageWidget(
                        selected: state.selectedLang.code ==
                            languageBloc.languages[index].code,
                        onTap: () {
                          languageBloc.add(ChangeLanguageEvent(languageBloc.languages[index]));
                        },
                        title: context.read<LanguageBloc>().languages[index].title,
                      );
                    }
                ),
          ),
        ),
      ),
    );
  }

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