import 'package:auto_route/auto_route.dart';
import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:gap/gap.dart';
import 'package:krow/core/presentation/styles/kw_text_styles.dart';
import 'package:krow/core/presentation/widgets/ui_kit/kw_button.dart';
import 'package:krow/features/auth/domain/bloc/auth_bloc.dart';
import 'package:krow/core/presentation/gen/assets.gen.dart';
import 'package:krow/core/application/routing/routes.gr.dart';
import 'package:krow/core/presentation/styles/theme.dart';
import 'package:krow/features/auth/presentation/screens/welcome/widgets/showcase_carousel_widget.dart';

@RoutePage()
class WelcomeScreen extends StatefulWidget {
  const WelcomeScreen({super.key});

  @override
  State<WelcomeScreen> createState() => _WelcomeScreenState();
}

class _WelcomeScreenState extends State<WelcomeScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: AppColors.bgColorDark,
      body: Stack(
        children: [
          Positioned.fill(
            child: SvgPicture.asset(
              Assets.images.bg.path,
              fit: BoxFit.cover,
            ),
          ),
          SafeArea(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                const Gap(20),
                Center(
                  child: Assets.images.logo.svg(),
                ),
                const Gap(20),
                const Expanded(
                  child: ShowcaseCarouselWidget(),
                ),
                const Gap(36),
                Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 16),
                  child: Column(
                    children: [
                      Text(
                        'work_that_fits'.tr(),
                        textAlign: TextAlign.center,
                        style: AppTextStyles.headingH1.copyWith(
                          color: AppColors.grayWhite,
                          height: 1,
                        ),
                      ),
                      const Gap(8),
                      Text(
                        'join_the_community'.tr(),
                        textAlign: TextAlign.center,
                        style: AppTextStyles.bodyMediumReg.copyWith(
                          color: AppColors.blackDarkBgBody,
                        ),
                      ),
                      const Gap(36),
                      KwButton.accent(
                        label: 'Sign Up'.tr(),
                        onPressed: () {
                          context
                              .read<AuthBloc>()
                              .add(const AuthTypeChangedEvent(AuthType.register));
                          context.pushRoute(
                              PhoneVerificationRoute(type: AuthType.register));
                        },
                      ),
                      const SizedBox(height: 16),
                      KwButton.outlinedAccent(
                        label: 'Log In'.tr(),
                        onPressed: () {
                          context
                              .read<AuthBloc>()
                              .add(const AuthTypeChangedEvent(AuthType.login));
                          context.pushRoute(
                              PhoneVerificationRoute(type: AuthType.login));
                        },
                      ),
                    ],
                  ),
                ),
                const Gap(34),
              ],
            ),
          ),
        ],
      ),
    );
  }
}
