import 'package:eatvio_app/core/locator_service.dart';
import 'package:eatvio_app/core/theme/custom_text_style.dart';
import 'package:eatvio_app/core/theme/theme_helper.dart';
import 'package:eatvio_app/core/widgets/custom_text_form_field.dart';
import 'package:eatvio_app/core/widgets/main_background_bouble.dart';
import 'package:eatvio_app/features/create_plan/presentation/cubit/create_plan_cubit.dart';
import 'package:eatvio_app/features/create_plan/presentation/widgets/options_count_button.dart';
import 'package:eatvio_app/features/create_plan/presentation/widgets/plan_duration_drop_down_widget.dart';
import 'package:eatvio_app/features/create_plan/presentation/widgets/plan_image_picker_widget.dart';
import 'package:eatvio_app/features/create_plan/presentation/widgets/plan_type_choice_widget.dart';
import 'package:eatvio_app/features/create_plan/presentation/widgets/select_exact_option_widget.dart';
import 'package:eatvio_app/generated/l10n.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

class CreatePlanScreen extends StatelessWidget {
  static const name = 'createPlanScreen';
  static const path = '/create-Plan-screen';
  const CreatePlanScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (context) => sl<CreatePlanCubit>(),
      child: const CreatePlanScreenContent(),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    final s = S.of(context);
    return Scaffold(
      backgroundColor: appTheme.gray100,
      appBar: AppBar(
        centerTitle: true,
        title: Text(
          s.adding_plan,
          textAlign: TextAlign.center,
          overflow: TextOverflow.ellipsis,
          softWrap: true,
          style: TextStyles.headingXLSemibold.copyWith(color: appTheme.black),
        ),
      ),
      body: Stack(
        children: [
          SingleChildScrollView(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                SizedBox(height: 8),
                MainBackgroundBouble(
                  padding: const EdgeInsets.symmetric(horizontal: 16),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      SizedBox(height: 16),
                      Text(
                        s.label,
                        textAlign: TextAlign.center,
                        overflow: TextOverflow.ellipsis,
                        softWrap: true,
                        style: TextStyles.textSMedium.copyWith(color: appTheme.black),
                      ),
                      SizedBox(height: 4),
                      CustomTextFormField(
                        hintText: s.plan_label_desc,
                        onChanged: (value) {
                          context.read<CreatePlanCubit>().setName(value);
                        },
                        maxLength: 150,
                      ),
                      SizedBox(height: 12),
                      Text(
                        s.plan_duration,
                        textAlign: TextAlign.center,
                        overflow: TextOverflow.ellipsis,
                        softWrap: true,
                        style: TextStyles.textSMedium.copyWith(color: appTheme.black),
                      ),
                      SizedBox(height: 4),
                      PlanDurationDropDownWidget(),
                      SizedBox(height: 20),
                      PlanImagePickerWidget(),
                      SizedBox(height: 16),
                      PlanTypeChoiceWidget(),
                      SizedBox(height: 16),
                      Text(
                        s.plan_desc,
                        textAlign: TextAlign.center,
                        overflow: TextOverflow.ellipsis,
                        softWrap: true,
                        style: TextStyles.textSMedium.copyWith(color: appTheme.black),
                      ),
                      SizedBox(height: 4),
                      SizedBox(
                        height: 132,
                        child: CustomTextFormField(
                          textAlignVertical: TextAlignVertical.top,
                          maxLength: 1000,
                          maxLines: null,
                          minLines: null,
                          expands: true,
                          hintText: s.plan_desc_example,
                          onChanged: (value) {
                            context.read<CreatePlanCubit>().setDetails(value);
                          },
                        ),
                      ),
                      SizedBox(height: 16),
                    ],
                  ),
                ),
                SizedBox(height: 20),
                Padding(
                  padding: const EdgeInsets.only(left: 16),
                  child: Text(
                    s.plan_desc,
                    textAlign: TextAlign.center,
                    overflow: TextOverflow.ellipsis,
                    softWrap: true,
                    style: TextStyles.headingXLSemibold.copyWith(color: appTheme.blueGray400),
                  ),
                ),
                SizedBox(height: 8),
                OptionsCountButton(),
                SizedBox(height: 200),
              ],
            ),
          ),
          Padding(
            padding: const EdgeInsets.only(bottom: 24.0),
            child: Align(
              alignment: Alignment.bottomCenter,
              child: SelectExactOptionWidget(),
            ),
          ),
        ],
      ),
    );
  }
}