import 'package:flutter/material.dart';
import 'package:flutter_platform_widgets/flutter_platform_widgets.dart';
import 'package:get_it/get_it.dart';
import 'package:skillcourt/pages/configuration.dart';
import 'package:skillcourt/pages/group_list.dart';
import 'package:skillcourt/pages/login_screen.dart';
import 'package:skillcourt/pages/player_list.dart';
import 'package:skillcourt/pages/user_registration.dart';
import 'package:skillcourt/services/auth.dart';
import 'package:skillcourt/utilities/utilities.dart';

final getIt = GetIt.instance;

class HomePage extends StatefulWidget {
  static const routeName = 'HomePage';
  const HomePage({Key? key}) : super(key: key);

  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  final Auth _auth = getIt<Auth>();

  @override
  Widget build(BuildContext context) {
    return StreamBuilder<AuthState>(
        stream: _auth.authState(),
        // ignore: body_might_complete_normally
        builder: (BuildContext context, AsyncSnapshot<AuthState> snapshot) {
          if (snapshot.data == AuthState.pending) {
            // Do something to await AuthState completion
          } else if (snapshot.data == AuthState.unauthenticated) {
            Navigator.pushNamed(context, LoginScreen.routeName);
          }

          return PlatformScaffold(
              appBar: PlatformAppBar(
                title: const Text('Skillcourt',
                    style: TextStyle(
                        fontFamily: 'Collegiate',
                        fontSize: 46,
                        color: Colors.black)),
                backgroundColor: Colors.green,
                trailingActions: <Widget>[
                  PlatformIconButton(
                      onPressed: () {
                        Navigator.pushNamed(context, ConfigPage.routeName);
                      },
                      icon: Icon(context.platformIcons.settings)),
                ],
              ),
              body: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: [
                    Expanded(
                        flex: 1,
                        child: ListView(
                          padding: const EdgeInsets.symmetric(
                              vertical: 10.0, horizontal: 5.0),
                          children: [
                            Utilities.buildButton(
                                label: 'Login',
                                 context: context, routeName: LoginScreen.routeName),
                            PlatformTextButton(
                                onPressed: () =>
                                    Navigator.pushNamed(context, ''),
                                child: const Text('Start Game'))
                          ],
                        )),
                    SizedBox(
                      height: 48.0,
                      child: ListView(
                        scrollDirection: Axis.horizontal,
                        children: <Widget>[
                          Utilities.buildIconButton(
                              context: context,
                              label: 'Players',
                              icon: Icon(context.platformIcons.person),
                              routeName: PlayerList.routeName),
                          Utilities.buildIconButton(
                              context: context,
                              label: 'Clubs',
                              icon: Icon(context.platformIcons.flag),
                              routeName: 'club-list'),
                          Utilities.buildIconButton(
                              context: context,
                              label: 'Groups',
                              icon: Icon(context.platformIcons.group),
                              routeName: GroupList.routeName),
                          //const VerticalDivider(),
                          Utilities.buildIconButton(
                              context: context,
                              label: 'User Registration',
                              icon: const Icon(Icons.insert_chart),
                              routeName: UserRegistration.routeName),
                        ],
                      ),
                    )
                  ]));
        });
  }
}
