import 'bloc/language_select_bloc.dart';
import 'models/language_select_model.dart';
import 'package:eatvio_app/core/app_export.dart';
import 'package:eatvio_app/widgets/custom_drop_down.dart';
import 'package:eatvio_app/widgets/custom_outlined_button.dart';
import 'package:flutter/material.dart';

class LanguageSelectScreen extends StatelessWidget {
  const LanguageSelectScreen({Key? key}) : super(key: key);

  static Widget builder(BuildContext context) {
    return BlocProvider<LanguageSelectBloc>(
        create: (context) => LanguageSelectBloc(
            LanguageSelectState(languageSelectModelObj: LanguageSelectModel()))
          ..add(LanguageSelectInitialEvent()),
        child: LanguageSelectScreen());
  }

  @override
  Widget build(BuildContext context) {
    mediaQueryData = MediaQuery.of(context);
    return SafeArea(
        child: Scaffold(
            body: Container(
                width: double.maxFinite,
                padding: EdgeInsets.symmetric(horizontal: 16.h, vertical: 5.v),
                child: Column(children: [
                  CustomImageView(
                      imagePath: ImageConstant.imgLogoEatvio,
                      height: 50.adaptSize,
                      width: 50.adaptSize),
                  SizedBox(height: 20.v),
                  _buildProgressIndicator(context),
                  SizedBox(height: 20.v),
                  Container(
                      width: 262.h,
                      margin: EdgeInsets.only(left: 41.h, right: 39.h),
                      child: Text("msg17".tr,
                          maxLines: 2,
                          overflow: TextOverflow.ellipsis,
                          textAlign: TextAlign.center,
                          style: theme.textTheme.headlineSmall)),
                  Spacer(flex: 36),
                  BlocSelector<LanguageSelectBloc, LanguageSelectState,
                          LanguageSelectModel?>(
                      selector: (state) => state.languageSelectModelObj,
                      builder: (context, languageSelectModelObj) {
                        return CustomDropDown(
                            icon: Container(
                                margin:
                                    EdgeInsets.fromLTRB(30.h, 11.v, 17.h, 11.v),
                                decoration: BoxDecoration(
                                    borderRadius: BorderRadius.circular(1.h)),
                                child: CustomImageView(
                                    imagePath: ImageConstant.imgFavorite,
                                    height: 12.adaptSize,
                                    width: 12.adaptSize)),
                            hintText: "lbl_english".tr,
                            items:
                                languageSelectModelObj?.dropdownItemList ?? [],
                            onChanged: (value) {
                              context
                                  .read<LanguageSelectBloc>()
                                  .add(ChangeDropDownEvent(value: value));
                            });
                      }),
                  Spacer(flex: 63)
                ])),
            bottomNavigationBar: _buildContinueButton(context)));
  }

  /// Section Widget
  Widget _buildProgressIndicator(BuildContext context) {
    return Container(
        width: 343.h,
        padding: EdgeInsets.symmetric(horizontal: 4.h, vertical: 3.v),
        decoration: AppDecoration.outlinePrimary
            .copyWith(borderRadius: BorderRadiusStyle.circleBorder8),
        child: Container(
            height: 8.v,
            width: 20.h,
            decoration: BoxDecoration(
                color: appTheme.blueA400,
                borderRadius: BorderRadius.circular(4.h),
                border:
                    Border.all(color: theme.colorScheme.primary, width: 1.h))));
  }

  /// Section Widget
  Widget _buildContinueButton(BuildContext context) {
    return CustomOutlinedButton(
        text: "lbl2".tr.toUpperCase(),
        margin: EdgeInsets.only(left: 16.h, right: 16.h, bottom: 50.v),
        buttonStyle: CustomButtonStyles.outlinePrimaryTL15,
        onPressed: () {
          navigteToGender(context);
        });
  }

  /// Navigates to the genderScreen when the action is triggered.
  navigteToGender(BuildContext context) {
    NavigatorService.pushNamed(
      AppRoutes.genderScreen,
    );
  }
}