Flutter | CustomBottomNavigationBar with go_router

flutter_go_router_tab_bar.dart

// WARNING
// Keep in mind that there are five button, but only four of them redirect to another screen, 
// since the middle one is a button that triggers the BottomSheet to be shown.

// This is the basic GoRouter setup

GoRouter(
  routes: <GoRoute>[
    GoRoute(
      path: '/:screenName(home|discover|notifications|profile)',
      builder: (BuildContext context, GoRouterState state) {
        final String screenName = state.params['screenName']!;

        return TabScreen(screenName: screenName);
      }
    )
  ]
);

// This is the basic TabScreen

class TabScreen extends StatelessWidget {

  const TabScreen({
    super.key,
    required this.screenName
  });

  final String screenName;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Expanded(
          child: screenName == 'home'
            ? const HomeScreen()
            : screenName == 'discover'
              ? const DiscoverScreen()
              : screenName == 'notifications'
                ? const NotificationsScreen()
                : const ProfileScreen()
        ),
        TabBottomNavigationBar(screenName: screenName)
      ]
    );
  }
}

// This is the basic TabBar

class TabBottomNavigationBar extends StatelessWidget {

  const TabBottomNavigationBar({
    super.key,
    required this.screenName
  });

  final String screenName;

  @override
  Widget build(BuildContext context) {
    return CustomBottomNavigationBar(
      items: List.generate(5, (int index) => CustomBottomNavigationBarItem(
        onPressed: () {
          switch (index) {
            case 0: 
              context.go('/home');
              break;
            case 1:
              context.go('/discover');
              break;
            case 2:
              break;
            case 3:
              context.go('/notifications');
              break;
            case 4:
              context.go('/profile');
              break;
          }
        }, 
        backgroundColor: index == 2 ? getThemeColor(context, colors: <Color>[ Palette.blue500, Palette.blue600 ]) : null,
        icon: CustomBottomNavigationBarItemIcon(
          icon: index == 0
            ? Icons.home_rounded
            : index == 1
              ? Icons.search_rounded
              : index == 2
                ? Icons.add_rounded
                : index == 3
                  ? Icons.notifications_rounded
                  : Icons.person_rounded,
          iconColor: index == 2 
            ? Palette.white 
            : null,
          isSelected: index == (screenName == 'home' ? 0 : screenName == 'discover' ? 1 : screenName == 'notifications' ? 3 : 4),
        )
      ))
    );
  }
}