Flutter: How do I prevent weird navigation in the case of showing HomePage only when user is verified through email?

151 views Asked by At

Intended Flow: Only show the home page when the user verifies their email. What is actually happening: The user can pop the navigation stack to show the home page.

I'm using Firebase to handle my authentication flow and currently am using a StreamBuilder to show either the landing page or the home page at the root of the app depending on if a user is verified and not null.

//create user object based on Firebase User
  UserApp _userFromFirebaseUser(User user) {
    return user != null ? UserApp(uid: user.uid, isVerified: user.emailVerified):null;
  }

//userapp type class
class UserApp {
  final String uid;
  final bool isVerified;
  UserApp({this.isVerified, this.uid});
}

Then I have a StreamBuilder that lives on top of my main.dart file:

class AuthWidgetBuilder extends StatelessWidget {
  const AuthWidgetBuilder({Key key, @required this.builder}) : super(key: key);
  final Widget Function(BuildContext, AsyncSnapshot<UserApp>) builder;

  @override
  Widget build(BuildContext context) {
    final authService = Provider.of<AuthService>(context, listen: false);
    return StreamBuilder<UserApp>(
        stream: authService.onAuthStateChanged,
        builder: (context, snapshot) {
          final UserApp user = snapshot.data;
          //only show home page if user is non null and also if they verified their email.
          if (user != null && authService.currentUser().isVerified == true) {
            return MultiProvider(
              providers: [
                Provider<UserApp>.value(value: user),
              ],
              child: builder(context, snapshot),
            );
          }
          return builder(context, snapshot);
        });
  }
}

class AuthWidget extends StatelessWidget {
  const AuthWidget({Key key, @required this.userSnapshot}) : super(key: key);
  final AsyncSnapshot<UserApp> userSnapshot;

  @override
  Widget build(BuildContext context) {
    if (userSnapshot.connectionState == ConnectionState.active) {
      return userSnapshot.hasData ? HomePage() : LandingPage();
    }
    return Scaffold(
      body: Center(
        child: CircularProgressIndicator(),
      ),
    );
  }
}

Then this is my main.dart file with the StreamBuilder and AuthService class on top of the widget tree:

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Provider<AuthService>(
        create: (_) => AuthService(),
        child: AuthWidgetBuilder(builder: (context, userSnapshot) {
          return MaterialApp(
            home: AuthWidget(userSnapshot: userSnapshot),
          );
        }));
  }

How come I can pop the navigation stack to reveal the home page, even when I have not yet verified the user through email? What do I need to change in my code to make sure that the user can only see the home page, after verifying their email? Is there any resource I can look at to understand these concepts better?

0

There are 0 answers