I my app I use riverpod to provide the routing (ShellRoute) to my page

When I select one of items in the bottom menu that item is high lighted and it is suppose to change the child off the main page to the selected page.

It selects it momentarily and then it reverts back to the default route, although the bottom menu do indicate the intended rout is selected.

Your help will be appreciated.

My routes

class AppRoutes {
  static final router = GoRouter(
      routerNeglect: true,
      initialLocation: SplashPage.route,
      navigatorKey: Utils.mainNav,
      routes: [
        GoRoute(
          parentNavigatorKey: Utils.mainNav,
          path: SplashPage.route,
          builder: (context, state) {
            return const SplashPage();
          },
        ),
        GoRoute(
          parentNavigatorKey: Utils.mainNav,
          path: LoadingPage.route,
          builder: (context, state) {
            return const LoadingPage();
          },
        ),
        ShellRoute(
            navigatorKey: Utils.tabNav,
            builder: (context, state, child) {
              return MainPage(child: child);
            },
            routes: [
              GoRoute(
                parentNavigatorKey: Utils.tabNav,
                path: HomePage.route,
                pageBuilder: (context, state) {
                  return const NoTransitionPage(
                    child: HomePage(),
                  );
                },
              ),
              GoRoute(
                parentNavigatorKey: Utils.tabNav,
                path: RoomsPage.route,
                pageBuilder: (context, state) {
                  return const NoTransitionPage(
                    child: RoomsPage(),
                  );
                },
              ),
              GoRoute(
                parentNavigatorKey: Utils.tabNav,
                path: DevicesPage.route,
                pageBuilder: (context, state) {
                  return const NoTransitionPage(
                    child: DevicesPage(),
                  );
                },
              ),
              GoRoute(
                parentNavigatorKey: Utils.tabNav,
                path: SettingsPage.route,
                pageBuilder: (context, state) {
                  return const NoTransitionPage(
                    child: SettingsPage(),
                  );
                },
              ),
            ]),
      ]);
}

Provider

final bottomBarMenuProvider =
    StateNotifierProvider<BottomBarMenuViewModel, List<BottomBarMenuItemModel>>(
        (ref) {
  final navItems = ref.read(bottomBarRepositoryProvider).getBottomBarNavItems();
  return BottomBarMenuViewModel(navItems, ref);
});

final bottomBarRepositoryProvider = Provider((ref) {
  return BottomMenuBarRepository();
});

Menu Repository

class BottomMenuBarRepository {
  List<BottomBarMenuItemModel> getBottomBarNavItems() {
    return const [
      BottomBarMenuItemModel(
        iconOption: Icons.home,
        route: HomePage.route,
        isSelected: true,
      ),
      BottomBarMenuItemModel(
        iconOption: Icons.door_back_door,
        route: RoomsPage.route,
      ),
      BottomBarMenuItemModel(
        iconOption: Icons.devices,
        route: DevicesPage.route,
      ),
      BottomBarMenuItemModel(
        iconOption: Icons.build,
        route: SettingsPage.route,
      )
    ];
  }
}

Bottom Menu

class HomeAutomationBottomMenu extends ConsumerWidget {
  const HomeAutomationBottomMenu({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final menuItems = ref.watch(bottomBarMenuProvider);

    return Container(
      padding: AppThemeStyles.xsmallPadding,
      child: Flex(
          direction: Axis.horizontal,
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: menuItems.map((e) {
            return Container(
              margin: const EdgeInsets.only(
                bottom: AppThemeStyles.smallSize,
              ),
              child: IconButton(
                  onPressed: () {
                    ref.read(bottomBarMenuProvider.notifier).selectedItem(e);
                    debugPrint(e.route);
                  },
                  icon: Icon(
                    e.iconOption,
                    color: e.isSelected
                        ? Theme.of(context).colorScheme.primary
                        : Theme.of(context).iconTheme.color,
                  )),
            );
          }).toList()),
    );
  }
}

Main Page

class MainPage extends StatelessWidget {
  final Widget child;
  const MainPage({super.key, required this.child});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Flex(
        direction: Axis.vertical,
        children: [
          Expanded(
            child: SafeArea(child: child),
          ),
          const HomeAutomationBottomMenu()
        ],
      ),
    );
  }
}

BottomBarViewModel where I update my route

class BottomBarViewModel extends StateNotifier<List<BottomBarMenuItemModel>> {
  final Ref ref;
  BottomBarViewModel(super.state, this.ref);

  void selectedItem(BottomBarMenuItemModel selectedItem) {
    state = [
      for (var item in state) item.copyWith(isSelected: selectedItem == item)
    ];

    GoRouter.of(Utils.tabNav.currentContext!).go(selectedItem.route);
  }

}