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/utils/localization_utils.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_diet/presentation/cubit/create_diet_cubit.dart';
import 'package:eatvio_app/features/create_diet/presentation/cubit/create_diet_state.dart';
import 'package:eatvio_app/features/create_diet/presentation/widgets/day_widget.dart';
import 'package:eatvio_app/features/create_diet/presentation/widgets/duration_drop_down_widget.dart';
import 'package:eatvio_app/features/create_diet/presentation/widgets/image_picker_widget.dart';
import 'package:eatvio_app/features/create_diet/presentation/widgets/status_drop_down_widget.dart';
import 'package:eatvio_app/features/create_diet/presentation/widgets/type_choice_widget.dart';
import 'package:eatvio_app/generated/l10n.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_svg/flutter_svg.dart';

class CreateDietScreen extends StatelessWidget {
  static const name = 'createDietScreen';
  static const path = '/create-diet-screen';
  const CreateDietScreen({super.key});

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

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

  @override
  Widget build(BuildContext context) {
    final s = S.of(context);
    return Scaffold(
      backgroundColor: appTheme.gray100,
      appBar: AppBar(
        centerTitle: true,
        title: Text(
          s.create_diet,
          textAlign: TextAlign.center,
          overflow: TextOverflow.ellipsis,
          softWrap: true,
          style: TextStyles.headingXLSemibold.copyWith(color: appTheme.black),
        ),
      ),
      body: SingleChildScrollView(
        child: Column(
          children: [
            SizedBox(height: 8),
            MainBackgroundBouble(
              padding: const EdgeInsets.symmetric(horizontal: 16),
              child: Column(
                children: [
                  SizedBox(height: 16),
                  CustomTextFormField(
                    hintText: s.enter_diet_name,
                    onChanged: (value) {
                      context.read<CreateDietCubit>().setName(value);
                    },
                  ),
                  SizedBox(height: 12),
                  SizedBox(
                    height: 132,
                    child: CustomTextFormField(
                      textAlignVertical: TextAlignVertical.top,
                      maxLines: null,
                      minLines: null,
                      expands: true,
                      hintText: s.enter_diet_description,
                      onChanged: (value) {
                        context.read<CreateDietCubit>().setDetails(value);
                      },
                    ),
                  ),
                  SizedBox(height: 12),
                  DurationDropDownWidget(),
                  SizedBox(height: 12),
                  StatusDropDownWidget(),
                  SizedBox(height: 16),
                  TypeChoiceWidget(),
                  SizedBox(height: 16),
                  ImagePickerWidget(),
                  SizedBox(height: 16),
                ],
              ),
            ),
            SizedBox(height: 16),
            BlocBuilder<CreateDietCubit, CreateDietState>(
              builder: (context, state) {
                return MainBackgroundBouble(
                  child: Padding(
                    padding: const EdgeInsets.symmetric(vertical: 16.0),
                    child: Center(
                      child: Text(
                        s.diet_plan + ' (${state.dietData.duration ?? 0} ' + getDayForm(state.dietData.duration ?? 0, s) + ')',
                        style: TextStyles.headingXLSemibold.copyWith(
                          color: appTheme.black,
                        ),
                      ),
                    ),
                  ),
                );
              },
            ),
            SizedBox(height: 8),
            DayWidget(
              index: 0,
            ),            
          ],
        ),
      ),
    );
  }
}