login page in bottomNavigationBar with flutter bloc - flutter

Question

need help.. I am new flutter bloc. I am trying implement login page in bottom navigation bar with bloc but not success. the navbar is:
beranda
pelatihan
pengetahuan
bantuan
profil (in profil if AuthenticationStatus.authenticated route to home page, if AuthenticationStatus.unauthenticated route to login page).
following code navigation cubit from https://medium.com/#antoniodominikovic/implementing-in-app-navigation-with-the-flutter-bottom-navigation-bar-using-the-bloc-architecture-84cda9c74dda and login bloc from https://bloclibrary.dev/#/flutterlogintutorial.
main class
void main() {
BlocOverrides.runZoned(
() async{
// Use blocs...
WidgetsFlutterBinding.ensureInitialized();
final userRepository = UserRepository();
userRepository.user?.id;
runApp(App(
authenticationRepository: AuthenticationRepository(),
userRepository: UserRepository(), connectivity: Connectivity(),
));
},
blocObserver: AppBlocObserver(),
);
}
app class:
class App extends StatelessWidget {
const App({
Key? key,
required this.authenticationRepository,
required this.userRepository,
required this.connectivity,
}) : super(key: key);
final AuthenticationRepository authenticationRepository;
final UserRepository userRepository;
final Connectivity connectivity;
#override
Widget build(BuildContext context) {
return RepositoryProvider.value(
value: authenticationRepository,
child: MultiBlocProvider(
providers: [
BlocProvider<NavigationCubit>(
create: (context) => NavigationCubit(),
),
BlocProvider<InternetCubit>(
create: (context) => InternetCubit(connectivity: connectivity)),
BlocProvider<AuthenticationBloc>(
create: (context) => AuthenticationBloc(
authenticationRepository: authenticationRepository,
userRepository: userRepository,
),
)
],
child: AppView(),
),
);
}
}
appview class:
class AppView extends StatefulWidget {
#override
_AppViewState createState() => _AppViewState();
}
class _AppViewState extends State<AppView> {
final _navigatorKey = GlobalKey<NavigatorState>();
NavigatorState get _navigator => _navigatorKey.currentState!;
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
backgroundColor: Colors.white,
bottomNavigationBar: BlocBuilder<NavigationCubit, NavigationInitial>(
builder: (context, state) {
return Container(
decoration: BoxDecoration(
color: Colors.white,
boxShadow: [
BoxShadow(
blurRadius: 20,
color: Colors.black.withOpacity(.1),
)
],
),
child: SafeArea(
child: Padding(
padding:
const EdgeInsets.symmetric(horizontal: 15.0, vertical: 8),
child: GNav(
rippleColor: Colors.grey[300]!,
hoverColor: Colors.grey[100]!,
gap: 8,
activeColor: Colors.black,
iconSize: 24,
padding: const EdgeInsets.symmetric(
horizontal: 15, vertical: 12),
duration: const Duration(milliseconds: 400),
tabBackgroundColor: Colors.grey[100]!,
color: Colors.black,
tabs: const [
GButton(
icon: LineIcons.home,
text: 'Home',
),
GButton(
icon: LineIcons.book,
text: 'Pelatihan',
),
GButton(
icon: LineIcons.search,
text: 'Pengetahuan',
),
GButton(
icon: LineIcons.facebookMessenger,
text: 'Bantuan',
),
GButton(
icon: LineIcons.user,
text: 'Profil',
),
],
selectedIndex: state.index,
onTabChange: (index) {
setState(() {
if (index == 0) {
BlocProvider.of<NavigationCubit>(context)
.getNavBarItem(NavbarItem.beranda);
} else if (index == 1) {
BlocProvider.of<NavigationCubit>(context)
.getNavBarItem(NavbarItem.pelatihan);
} else if (index == 2) {
BlocProvider.of<NavigationCubit>(context)
.getNavBarItem(NavbarItem.pengetahuan);
} else if (index == 3) {
BlocProvider.of<NavigationCubit>(context)
.getNavBarItem(NavbarItem.bantuan);
} else if (index == 4) {
BlocProvider.of<NavigationCubit>(context)
.getNavBarItem(NavbarItem.profil);
}
});
},
),
),
),
);
},
),
body: BlocBuilder<NavigationCubit, NavigationInitial>(
builder: (context, statenav) {
if (statenav.navbarItem == NavbarItem.beranda) {
return const BerandaPage();
} else if (statenav.navbarItem == NavbarItem.pelatihan) {
return const PelatihanPage();
} else if (statenav.navbarItem == NavbarItem.pengetahuan) {
return const PengetahuanPage();
} else if (statenav.navbarItem == NavbarItem.bantuan) {
return const BantuanPage();
} else if (statenav.navbarItem == NavbarItem.profil) {
// return LoginPage();
return MaterialApp(
navigatorKey: _navigatorKey,
builder: (context, child) {
return BlocListener<AuthenticationBloc, AuthenticationState>(
listener: (context, state) {
switch (state.status) {
case AuthenticationStatus.authenticated:
_navigator.pushAndRemoveUntil<void>(
HomePage.route(),
(route) => false,
);
statenav.navbarItem == NavbarItem.profil;
break;
case AuthenticationStatus.unauthenticated:
_navigator.pushAndRemoveUntil<void>(
LoginPage.route(),
(route) => false,
);
statenav.navbarItem == NavbarItem.profil;
break;
default:
break;
}
},
child: child,
);
},
onGenerateRoute: (_) => SplashPage.route(),
);
}
return Container();
}),
),
);
}
}
there is no error code, when the first time I select the profile tab, the login page appears. But when I select another tab and go back to the profile tab, CircularProgressIndicator from the splash page is appear. please tell me and teach me or any references?, thanks