How to handle user authentication state in flutter - firebase

Question

I'm having this very strange behaviour with firebase and flutter.
My goal is show a screen when the users are logged in, and a different one where they can sign in.
See my main function below
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
runApp(ProviderScope(child: MyApp()));
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return ScreenUtilInit(
designSize: Size(360, 690),
allowFontScaling: false,
builder: () => MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.red,
),
home: StreamBuilder(
stream: FirebaseAuth.instance.userChanges(),
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.active) {
return FirebaseAuth.instance.currentUser == null
? StartupPage()
: AppHome();
}
return Text("");
}),
),
);
}
}
The login screen:
class LoginPage extends HookWidget {
final GlobalKey<FormState> _key = GlobalKey<FormState>();
#override
Widget build(BuildContext context) {
final _emailController =
useTextEditingController.fromValue(TextEditingValue.empty);
final _passwordController =
useTextEditingController.fromValue(TextEditingValue.empty);
return Scaffold(
backgroundColor: Color(0xFFA46EE2),
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
child: Image.asset(
"assets/images/LOGO.png",
height: 60.h,
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Form(
key: _key,
child: Column(
children: [
Text(
"Welcome back!",
style: primaryHeadline,
),
Padding(
padding: const EdgeInsets.all(1.0),
child: CustomTextField(
hintText: "Email",
secured: false,
isEmail: false,
onSave: (data) {},
onValidate: (value) => validator(value, "Email"),
controller: _emailController,
),
),
Padding(
padding: const EdgeInsets.all(1.0),
child: CustomTextField(
hintText: "Password",
secured: true,
isEmail: false,
onSave: (data) {},
onValidate: (value) => validator(value, "Password"),
controller: _passwordController,
),
),
SizedBox(height: 10),
InkWell(
onTap: () async {
if (_key.currentState.validate()) {
await FirebaseAuth.instance.signInWithEmailAndPassword(
email: _emailController.text,
password: _passwordController.text,
);
// Navigator.of(context).pushReplacement(
// MaterialPageRoute(
// fullscreenDialog: true,
// builder: (context) => AppHome(),
// ),
// );
}
},
child: Container(
height: 40.h,
decoration: BoxDecoration(
color: defaultBackgroundColor,
borderRadius: BorderRadius.circular(defaultRadius)),
alignment: Alignment.center,
child: Text(
'Log in',
style: defaultWhiteText,
),
),
)
],
),
),
),
],
),
);
}
}
The register screen
class RegisterPage extends HookWidget {
final GlobalKey<FormState> _key = GlobalKey<FormState>();
#override
Widget build(BuildContext context) {
final _emailController =
useTextEditingController.fromValue(TextEditingValue.empty);
final _passwordController =
useTextEditingController.fromValue(TextEditingValue.empty);
return Scaffold(
backgroundColor: Color(0xFFF5EFFC),
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Container(
child: Image.asset(
"assets/images/ELEMENT_02.png",
height: 60.h,
),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Form(
key: _key,
child: Column(
children: [
Padding(
padding: const EdgeInsets.all(1.0),
child: CustomTextField(
hintText: "Email",
secured: false,
isEmail: false,
onSave: (data) {},
onValidate: (value) => validator(value, "Email"),
controller: _emailController,
),
),
Padding(
padding: const EdgeInsets.all(1.0),
child: CustomTextField(
hintText: "Password",
secured: true,
isEmail: false,
onSave: (data) {},
onValidate: (value) => validator(value, "Password"),
controller: _passwordController,
),
),
SizedBox(height: 10),
InkWell(
onTap: () async {
if (_key.currentState.validate()) {
await FirebaseAuth.instance
.createUserWithEmailAndPassword(
email: _emailController.text,
password: _passwordController.text,
);
}
},
child: Container(
height: 40.h,
decoration: BoxDecoration(
color: defaultBackgroundColor,
borderRadius: BorderRadius.circular(defaultRadius)),
alignment: Alignment.center,
child: Text(
'Signup now',
style: defaultWhiteText,
),
),
)
],
),
),
),
],
),
);
}
}
I'm having this behaviour:
when I register with email and password, then sign out, the StartupPage is displayed as expected.
When I sign in, then sign out, the AppHome is not displayed.
What did I do wrong?

Answer 1

When you signOut, currentUser becomes null.
FirebaseAuth.instance.currentUser == null
? StartupPage()
: AppHome();
This will return StartupPage() after signing out.
So your code is working fine I guess.