import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:go_router/go_router.dart';
import 'package:uae_stat/config/theme/theme_provider.dart';
import 'package:uae_stat/domain/use_cases/language.dart';
import 'package:uae_stat/infrastructure/services/img_asset_paths/banner_asset_path.dart';
import 'package:uae_stat/infrastructure/services/img_asset_paths/logo_asset_path.dart';

class Welcomepage extends ConsumerStatefulWidget {
  const Welcomepage({super.key});

  @override
  ConsumerState<Welcomepage> createState() => _WelcomepageState();
}

class _WelcomepageState extends ConsumerState<Welcomepage> {
  @override
  Widget build(BuildContext context) {
    double myheight = MediaQuery.of(context).size.height;
    double mywidth = MediaQuery.of(context).size.width;

    final isDarkTheme = ref.read(themeProvider) == ThemeMode.dark ||
        (ref.read(themeProvider) == ThemeMode.system &&
            MediaQuery.of(context).platformBrightness == Brightness.dark);

    final fcscBanner = Image.asset(
      BannerAssetPath.fcscLogoLight,
      height: 40,
    );
    final uaestat = Image.asset(
      LogoAssetPath.uaeStatLight,
      height: 50,
    );

    return SafeArea(
      child: Scaffold(
        body: Container(
          width: mywidth,
          height: myheight,
          padding: EdgeInsets.zero,
          margin: EdgeInsets.zero,
          color: isDarkTheme ? Colors.black : Colors.white,
          child: Column(
            children: [
              Container(
                padding: EdgeInsets.only(
                    top: myheight * 0.05,
                    left: mywidth * 0.2,
                    right: mywidth * 0.2,
                    bottom: 0),
                height: myheight > 500 ? myheight * 0.35 : 230,
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Text(
                      context.translate('Welcome to', 'مرحبًا بك في'),
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        fontFamily: 'Roboto',
                        fontSize: 30,
                        fontWeight: FontWeight.normal,
                        color: isDarkTheme ? Colors.white : Colors.black,
                      ),
                    ),
                    const SizedBox(height: 6),
                    uaestat,
                    const SizedBox(height: 6),
                    Text(
                      context.translate('Your Ultimate statistics Companion',
                          'رفيقك الأمثل للإحصائيات'),
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        fontFamily: 'Roboto',
                        fontSize: 22,
                        color: isDarkTheme ? Color(0xFF898C81) :  Color(0xFF898C81),
                      ),
                    ),
                  ],
                ),
              ),
              Container(
                padding: EdgeInsets.zero,
                margin: EdgeInsets.zero,
                width: mywidth,
                height: myheight * 0.5,
                decoration: const BoxDecoration(
                  image: DecorationImage(
                    image: AssetImage('assets/app_tour/welcome2.png'),
                    fit: BoxFit.fitWidth,
                  ),
                ),
                child: Padding(
                  padding: const EdgeInsets.only(bottom: 40),
                  child: Align(
                    alignment: Alignment.bottomCenter,
                    child: ElevatedButton(
                      onPressed: () {
                        context.go('/myhomepage');
                      },
                      style: ButtonStyle(
                        backgroundColor:
                        WidgetStateProperty.all(const Color(0xFF90B0D5)),
                      ),
                      child: Text(
                        context.translate("Let's get Started", 'لنبدأ'),
                        style: const TextStyle(
                          color: Colors.white,
                          fontFamily: 'Roboto',
                          fontSize: 16,
                        ),
                      ),
                    ),
                  ),
                ),
              ),
              Padding(
                padding: const EdgeInsets.symmetric(horizontal: 50),
                child: Image.asset(
                  isDarkTheme
                      ? BannerAssetPath.fcscLogoDark
                      : BannerAssetPath.fcscLogoLight,
                  height: 30,
                ),
              )
            ],
          ),
        ),
      ),
    );
  }
}