How to keep state of AutoTabsRouter

[giordy16]

Hi, I want to use a ValueListenableBuilder to handle theme change on my app, but every time it's get triggered and rebuilds the app, AutoTabsRouter looses the current page. In this example, when I change the theme from the Switch, I am brought back to Home, but I want to stay in Settings

ValueNotifier<ThemeData> themeNotifier = ValueNotifier(ThemeData.light());

void main() {
  WidgetsFlutterBinding.ensureInitialized();

  runApp(ValueListenableBuilder(
      valueListenable: themeNotifier,
      builder: (context, theme, child) {
        return MaterialApp.router(
          theme: theme,
          routerConfig: AppRouter().config(),
        );
      }));
}

@RoutePage()
class MainLandingScreen extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return AutoTabsRouter(
      routes: [
        HomeRoute(),
        SettingsRoute(),
      ],
      builder: (context, child) {
        final tabsRouter = AutoTabsRouter.of(context);

        return Scaffold(
          body: child,
          bottomNavigationBar: BottomNavigationBar(
            currentIndex: tabsRouter.activeIndex,
            onTap: tabsRouter.setActiveIndex,
            type: BottomNavigationBarType.fixed,
            selectedLabelStyle: const TextStyle(fontSize: 12),
            unselectedLabelStyle: const TextStyle(fontSize: 12),
            items: [
              BottomNavigationBarItem(
                  label: 'Home', icon: Icon(Icons.home_outlined)),
              BottomNavigationBarItem(
                  label: 'Settings', icon: Icon(Icons.settings)),
            ],
          ),
        );
      },
    );
  }
}

@RoutePage()
class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(body: Center(child: Text("Home")));
  }
}

@RoutePage()
class SettingsScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {

    return Scaffold(
        body: Center(
      child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          mainAxisSize: MainAxisSize.max,
          children: [
            Switch(
                value: themeNotifier.value == ThemeData.light(),
                onChanged: (value) {
                  themeNotifier.value =
                      value ? ThemeData.light() : ThemeData.dark();
                })
          ]),
    ));
  }
}


@AutoRouterConfig(replaceInRouteName: 'Screen|Page,Route')
class AppRouter extends RootStackRouter {
  @override
  RouteType get defaultRouteType => RouteType.material();

  @override
  List<AutoRoute> get routes => [
        AutoRoute(
          page: MainLandingRoute.page,
          initial: true,
          children: [
            AutoRoute(page: HomeRoute.page),
            AutoRoute(page: SettingsRoute.page),
          ],
        )
      ];
}