Using Streambuilder with Flutter and GoRouter to persist User State - flutter

Question

Anyone used Streambuilder with Flutter and GoRouter before to persist User state?
Currently, I'm using the default Flutter navigation and it's working fine (see below) but I'm trying to replace with GoRouter now
My previous navigation setup using default Flutter navigation
home: StreamBuilder(
stream: AuthMethods().authChanges,
builder: (context, snapshot) {
if (snapshot.connectionState == ConnectionState.waiting) {
return const Center(
child: CircularProgressIndicator(),
);
}
if (snapshot.hasData) {
return const TabsScreen();
}
return const AuthScreen();
}),
);
}
My current goRouter code. I'm wondering where I can use Streambuilder in d code below to persist user state for my app (or whether Streambuilder can be used at all with go router)
GoRouter routeConstruct() {
return GoRouter(
routes: <RouteBase>[
GoRoute(
path: '/',
builder: (BuildContext context, GoRouterState state) {
return const PublicScreen();
},
routes: <RouteBase>[
GoRoute(
path: Events_Screen,
builder: (BuildContext context, GoRouterState state) {
return const EventsScreen();
},
),
GoRoute(
path: "$EventDetail_Screen/:eventId",
builder: (BuildContext context, GoRouterState state) {
return EventDetailScreen(eventId: state.params['eventId']!);
},
),
...
]),
],
);
Can I use Streambuilder with Flutter and GoRouter to persist User authentication state? If can, where in the goRouter code can I use Streambuilder to determine which widget to show based on Auth state? Thanks
###########################
class AuthMethods
class AuthMethods {
final FirebaseAuth _auth = FirebaseAuth.instance;
final FirebaseFirestore _firestore = FirebaseFirestore.instance;
Stream<User?> get authChanges => _auth.authStateChanges();
// --> use of bang ! operator here
User get user => _auth.currentUser!;
Future<bool> signInWithGoogle(BuildContext context) async {
bool res = false;
try {
final GoogleSignInAccount? googleUser = await GoogleSignIn().signIn();
final GoogleSignInAuthentication? googleAuth =
await googleUser?.authentication;
final credential = GoogleAuthProvider.credential(
accessToken: googleAuth?.accessToken, idToken: googleAuth?.idToken);
UserCredential userCredential =
await _auth.signInWithCredential(credential);
User? user = userCredential.user;
if (user != null) {
if (userCredential.additionalUserInfo!.isNewUser) {
await _firestore.collection('users').doc(user.uid).set({
'username': user.displayName,
'uid': user.uid,
'profilePhoto': user.photoURL,
});
}
res = true;
}
} on FirebaseAuthException catch (e) {
showSnackBar(context, e.message!);
res = false;
}
return res;
}
class RouteNotifier
class RouterNotifier extends ChangeNotifier {
RouterNotifier(this._authMethods) {
_authMethods.authChanges.listen((event) {
notifyListeners();
});
}
final AuthMethods _authMethods;
String? redirect(BuildContext context, GoRouterState state) {
final onLoginPage = state.location == '/$AuthScreen';
final onHomePage = state.location == '/$Tabs_Screen';
// --> The getter 'isEmpty' isn't defined for the type 'User'.
// --> User get user => _auth.currentUser!; used a bang operator
if (_authMethods.user.isEmpty && onHomePage) {
return '/$AuthScreen';
}
// --> The getter 'isEmpty' isn't defined for the type 'User'.
if (_authMethods.currentUser.isNotEmpty && onLoginPage) {
return '/$Tabs_Screen';
}
return null;
}
}
router.dart
GoRouter routeConstruct() {
return GoRouter(
refreshListenable: router,
routes: <RouteBase>[
GoRoute(
path: '/',
builder: (BuildContext context, GoRouterState state) {
return const PublicScreen();
},
routes: <RouteBase>[
GoRoute(
path: Events_Screen,
builder: (BuildContext context, GoRouterState state) {
return const EventsScreen();
},
),
GoRoute(
path: "$EventDetail_Screen/:eventId",
builder: (BuildContext context, GoRouterState state) {
return EventDetailScreen(eventId: state.params['eventId']!);
},
),
]),
],
);
}

Answer 1

before go router 5.0.0 :
go router has class called GoRouterRefreshStream, so in go router
GoRouter (
....
refreshListenable: GoRouterRefreshStream(AuthMethods().authChanges),
but after go router 5.0.0, they remove it
so you must create your own notifier :
class RouterNotifier extends ChangeNotifier {
RouterNotifier(this._authMethods) {
_authMethods.authChanges.listen((event) {
notifyListeners();
});
}
final AuthMethods _authMethods;
}
on go Router:
GoRouter(
debugLogDiagnostics: false,
....
...
refreshListenable: RouterNotifier(AuthMethods()),
...
);
and how go router can work like stream builder you use before?
redirect come in handy:
final router = RouterNotifier(AuthMethods());
GoRouter (
...
refreshListenable: router,
redirect: router.redirect,
in RouterNotifier class :
class RouterNotifier extends ChangeNotifier {
RouterNotifier(this._authMethods) {
_authMethods.authChanges.listen((event) {
notifyListeners();
});
}
final AuthMethods _authMethods;
String? redirect(BuildContext context, GoRouterState state) {
final onLoginPage = state.location == '/login';
final onHomePage = state.location == '/';
if (_authMethods.currentUser.isEmpty && onHomePage) {
return '/login';
}
if (_authMethods.currentUser.isNotEmpty && onLoginPage) {
return '/';
}
return null;
}
}
class User model :
class User {
String id;
.........
some variable i need from db;
static const empty = User(id: '');
bool get isEmpty => this == User.empty;
bool get isNotEmpty => this != User.empty;
}
on Stream :
Stream<User> get user {
// map the user if user null is mean empty
return _firebaseAuth.authStateChanges().asyncMap((fUser) async {
if (fUser == null) {
const User user = User.empty;
return user;
} else {
// in my case i need to take some data from Firestore
....
await datafromDb() // if you dont need to wait future, remove async map, just use normal map
return fUser.withBiodata();