import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:injector/injector.dart';
import 'package:prosappco/blocs/authentication_bloc/authentication_bloc.dart';
import 'package:prosappco/blocs/sign_up_bloc/sign_up_bloc.dart';
import 'package:prosappco/blocs/sing_in_bloc/sign_in_bloc.dart';
import 'package:prosappco/screens/authentication/sign_in_screen.dart';
import 'package:prosappco/screens/authentication/sign_up_screen.dart';

class SignScreen extends StatefulWidget {
  final int initialIndex;

  const SignScreen({super.key, required this.initialIndex});

  @override
  State<SignScreen> createState() => _SignScreenState();
}

class _SignScreenState extends State<SignScreen> with TickerProviderStateMixin {
  late TabController tabController;
  @override
  void initState() {
    super.initState();
    tabController = TabController(
      initialIndex: widget.initialIndex,
      length: 2,
      vsync: this,
    );
  }

  @override
  Widget build(BuildContext context) {
    double width = MediaQuery.of(context).size.width;
    return BlocListener<AuthenticationBloc, AuthenticationState>(
        listener: (context, state) {
          if (state.status == AuthenticationStatus.authenticated) {
            Navigator.pop(context);
          }
        },
        child: Scaffold(
          backgroundColor: Theme.of(context).colorScheme.tertiary,
          body: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Padding(
                padding: const EdgeInsets.symmetric(vertical: 20),
                child: Center(
                  child: Image(
                    width: width * 0.7,
                    image: const AssetImage('images/logo_prosapp.png'),
                  ),
                ),
              ),
              Expanded(
                child: Container(
                  decoration: const BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.only(
                      topLeft: Radius.circular(60),
                      topRight: Radius.circular(60),
                    ),
                  ),
                  child: Padding(
                    padding: const EdgeInsets.symmetric(
                        horizontal: 30, vertical: 15),
                    child: SingleChildScrollView(
                      child: SizedBox(
                        height: MediaQuery.of(context).size.height - 200,
                        child: TabBarView(
                          controller: tabController,
                          children: [
                            BlocProvider<SignInBloc>(
                              create: (context) =>
                                  Injector.appInstance.get<SignInBloc>(),
                              child: SignInScreen(),
                            ),
                            BlocProvider<SignUpBloc>(
                              create: (context) =>
                                  Injector.appInstance.get<SignUpBloc>(),
                              child: SignUpScreen(),
                            ),
                          ],
                        ),
                      ),
                    ),
                  ),
                ),
              )
            ],
          ),
        )

        // Scaffold(
        //   // appBar: AppBar(
        //   //   backgroundColor: Theme.of(context).colorScheme.tertiary,
        //   // ),
        //   body: Column(
        //     children: [
        //       // Text('${context.read<SignInBloc>().state}'),
        //       Container(
        //         color: Theme.of(context).colorScheme.tertiary,
        //         child: Column(
        //           children: [
        //             Container(
        //               color: Theme.of(context).colorScheme.tertiary,
        //               padding: const EdgeInsets.only(bottom: 20.0),
        //               child: Center(
        //                 child: Image(
        //                   width: width * 0.7,
        //                   image: const AssetImage('images/logo_prosapp.png'),
        //                 ),
        //               ),
        //             ),
        //           ],
        //         ),
        //       ),
        //       Expanded(
        //         child: SingleChildScrollView(
        //           child: SizedBox(
        //             height: MediaQuery.of(context).size.height,
        //             child: Column(
        //               children: [
        //                 Expanded(
        //                   child: TabBarView(controller: tabController, children: [
        //                     BlocProvider<SignInBloc>(
        //                       create: (context) =>
        //                           Injector.appInstance.get<SignInBloc>(),
        //                       child: SignInScreen(),
        //                     ),
        //                     BlocProvider<SignUpBloc>(
        //                       create: (context) =>
        //                           Injector.appInstance.get<SignUpBloc>(),
        //                       child: SignUpScreen(),
        //                     ),
        //                   ]),
        //                 )
        //               ],
        //             ),
        //           ),
        //         ),
        //       ),
        //     ],
        //   ),
        // ),
        );
  }
}