velocity-pay-flutter/lib/screens/onboarding/register/register_screen.dart

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter_dotenv/flutter_dotenv.dart';
import 'package:go_router/go_router.dart';
import 'package:google_sign_in/google_sign_in.dart';
import 'package:provider/provider.dart';
import 'package:qpay/screens/onboarding/onboarding_controller.dart';
import 'package:skeletonizer/skeletonizer.dart';

class RegisterScreen extends StatefulWidget {
  const RegisterScreen({super.key});

  @override
  State<RegisterScreen> createState() => _RegisterScreenState();
}

class _RegisterScreenState extends State<RegisterScreen> {
  late OnboardingController onboardingController;

  bool _loading = false;

  List<String> scopes = <String>[
    'https://www.googleapis.com/auth/contacts.readonly',
  ];

  @override
  void initState() {
    super.initState();
    onboardingController = Provider.of<OnboardingController>(
      context,
      listen: false,
    );
    // onboardingController.resetState();
  }

  void signInWithGoogle() {
    final GoogleSignIn googleSignIn = GoogleSignIn.instance;

    unawaited(googleSignIn.initialize(serverClientId: dotenv.env['CLIENTID']));

    if (GoogleSignIn.instance.supportsAuthenticate()){
      unawaited(GoogleSignIn.instance.authenticate().then((value) {
        print(value);
        onboardingController.updateGoogleUser(value);
        googleSignIn.authenticationEvents
            .listen(_handleAuthenticationEvent)
            .onError(_handleAuthenticationError);

      }));
    }
  }

  Future<void> _handleAuthenticationEvent(
      GoogleSignInAuthenticationEvent event,
      ) async {
    // #docregion CheckAuthorization
    final GoogleSignInAccount? user = // ...
    // #enddocregion CheckAuthorization
    switch (event) {
      GoogleSignInAuthenticationEventSignIn() => event.user,
      GoogleSignInAuthenticationEventSignOut() => null,
    };

    // Check for existing authorization.
    // #docregion CheckAuthorization
    final GoogleSignInClientAuthorization? authorization = await user
        ?.authorizationClient
        .authorizationForScopes(scopes);
    // #enddocregion CheckAuthorization
  }

  Future<void> _handleAuthenticationError(Object e) async {
    print(e.toString());
  }

  @override
  Widget build(BuildContext context) {
    return ListenableBuilder(
      listenable: onboardingController,
      builder: (context, child) {
        return Scaffold(
          body: SingleChildScrollView(
            child: Padding(
              padding: const EdgeInsets.all(25),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  SizedBox(height: 75),
                  Text(
                    'Registration',
                    style: TextStyle(
                      fontSize: 30,
                      fontWeight: FontWeight.bold,
                      color: Theme.of(context).colorScheme.primary,
                    ),
                  ),
                  SizedBox(height: 5),
                  Text(
                    "Let's start by getting some of your details online to get you started",
                    style: TextStyle(fontSize: 18),
                    textAlign: TextAlign.center,
                  ),
                  Image.asset('assets/social.png', width: 300),
                  SizedBox(height: 20),

                  // Social Login Buttons
                  if(onboardingController.model.googleUser == null)
                  Column(
                    children: [
                      Row(
                        children: [
                          Expanded(child: Divider(color: Colors.grey.shade300)),
                          Padding(
                            padding: EdgeInsets.symmetric(horizontal: 16),
                            child: Text(
                              'Choose from the options below to continue',
                              style: TextStyle(
                                color: Colors.grey.shade600,
                                fontSize: 14,
                              ),
                              textAlign: TextAlign.center,
                            ),
                          ),
                          Expanded(child: Divider(color: Colors.grey.shade300)),
                        ],
                      ),
                      SizedBox(height: 20),
                      Skeletonizer(
                        enabled: _loading,
                        child: Row(
                          children: [
                            Expanded(
                              child: OutlinedButton.icon(
                                onPressed: () {
                                  signInWithGoogle();
                                },
                                icon: Image.asset(
                                  'assets/google.png',
                                  width: 20,
                                  height: 20,
                                ),
                                label: Text('Google', style: TextStyle(fontSize: 16)),
                                style: OutlinedButton.styleFrom(
                                  padding: EdgeInsets.symmetric(vertical: 16),
                                  side: BorderSide(color: Colors.grey.shade300),
                                  shape: RoundedRectangleBorder(
                                    borderRadius: BorderRadius.circular(12),
                                  ),
                                ),
                              ),
                            ),
                            SizedBox(width: 16),
                          ],
                        ),
                      ),
                    ],
                  ),
                  if(onboardingController.model.googleUser != null)
                    Column(
                      children: [
                        SizedBox(
                          width: 100,
                          child: Divider(
                            color: Colors.grey.shade300,
                            thickness: 1,
                          ),
                        ),
                        SizedBox(height: 20,),
                        Text(
                            "Welcome, ${onboardingController.model.googleUser?.displayName}",
                            style: TextStyle(fontSize: 25),
                          textAlign: TextAlign.center,
                        ),
                        SizedBox(height: 10,),
                        Text("Tap Proceed to continue", style: TextStyle(fontSize: 18),)
                      ],
                    ),
                  SizedBox(height: 40),

                ],
              ),
            ),
          ),
          bottomNavigationBar: SizedBox(
            height: 130,
            child: Column(
              children: [
                Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 25),
                  child: Row(
                    children: [
                      Expanded(
                        child: ElevatedButton(
                          onPressed: () {
                            if (onboardingController.model.googleUser == null) {
                              showDialog(
                                context: context,
                                builder: (BuildContext dialogContext) {
                                  return AlertDialog(
                                    title: const Text('Sign-In Required'),
                                    content: const Text(
                                        "Please sign in with one of the social media platforms to proceed."),
                                    actions: <Widget>[
                                      TextButton(
                                        child: const Text('OK'),
                                        onPressed: () {
                                          Navigator.of(dialogContext).pop(); // Close the dialog
                                        },
                                      ),
                                    ],
                                  );
                                },
                              );
                            } else {
                              context.go('/onboarding/phone');
                            }
                          },
                          child: Text('Proceed', style: TextStyle(fontSize: 16)),
                        ),
                      ),
                      SizedBox(width: 16),
                      Expanded(
                        child: TextButton(
                          onPressed: () {
                            context.go('/onboarding/login');
                          },
                          child: Text(
                            'Go to Login',
                            style: TextStyle(fontSize: 16),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
                SizedBox(height: 5),
                TextButton(
                  onPressed: () {
                    context.go('/');
                  },
                  child: Text('Continue as guest?', style: TextStyle(fontSize: 14)),
                ),
              ],
            ),
          ),
        );
      }
    );
  }
}