AutoRouter BottomNavigationBar is drawn twice in a row

Question

I am using Autorouter's bottom navigation bar, it is drawn twice, one after the other and one on top of the other, but I don't want that. Similar situation is valid for some of my pages when the application runs. How can I fix the problem ? For example, after writing debugConsole in the build method of the pages, in the debug console, respectively

app_router.dart

part 'app_router.gr.dart';

/// [AppRouter] is the router of the app
@AutoRouterConfig(replaceInRouteName: AppRouter._replaceInRouteName)
final class AppRouter extends _$AppRouter {
  static const _replaceInRouteName = 'View,Route';
  @override
  List<AutoRoute> get routes => [
        AutoRoute(
          page: HomeRoute.page,
          initial: true,
          children: [
            AutoRoute(
              page: RootRoute.page,
              // initial: true,
              children: [
                AutoRoute(page: DictionaryRoute.page),
                AutoRoute(page: OwnDictionaryRoute.page),
              ],
            ),
          ],
        ),
        AutoRoute(page: OTPRoute.page),
        AutoRoute(page: PhoneNumberVerificationRoute.page),
        AutoRoute(page: SignUpRoute.page),
      ];
}

home_view.dart

/// [HomeView] is the view of home page
@RoutePage()
final class HomeView extends StatelessWidget {
  /// Constructor
  const HomeView({super.key});

  @override
  Widget build(BuildContext context) {
    debugPrint('HomeView build');
    context.read<ProductViewModel>().checkSignIn();
    return BlocSelector<ProductViewModel, ProductState, bool>(
      selector: (state) {
        return state.isSignedIn;
      },
      builder: (context, state) {
        return state ? const RootView() : const SignUpView();
      },
    );
  }
}

root_view.dart

/// [RootView] is the view of root page
@RoutePage()
final class RootView extends StatelessWidget {
  /// Constructor
  const RootView({super.key});

  @override
  Widget build(BuildContext context) {
    debugPrint('RootView build');
    return AutoTabsScaffold(
      routes: const [
        DictionaryRoute(),
        OwnDictionaryRoute(),
      ],
      bottomNavigationBuilder: (_, tabsRouter) {
        // final tabsRouter = AutoTabsRouter.of(context);
        return BottomNavigationBar(
          currentIndex: tabsRouter.activeIndex,
          onTap: tabsRouter.setActiveIndex,
          items: const [
            BottomNavigationBarItem(
              icon: Icon(Icons.search_outlined),
              label: 'Dictionary',
            ),
            BottomNavigationBarItem(
              icon: Icon(Icons.list_outlined),
              label: 'Own Dictionary',
            ),
          ],
        );
      },
    );
  }
}

dictionary_view.dart

/// [DictionaryView] is the view of dictionary page
@RoutePage()
final class DictionaryView extends StatefulWidget {
  /// Constructor
  const DictionaryView({super.key});

  @override
  State<DictionaryView> createState() => _DictionaryViewState();
}

class _DictionaryViewState extends State<DictionaryView>
    with DictionaryViewMixin {
  @override
  Widget build(BuildContext context) {
    debugPrint('DictionaryView build');
    return BlocProvider(
      create: (context) => dictionaryViewModel,
      child: BaseView(
        onPageBuilder: (context, value) => SliverList(
          delegate: SliverChildListDelegate(
            [
              _DictionaryBody(
                dictionaryViewModel: dictionaryViewModel,
                searchController: searchController,
              ),
            ],
          ),
        ),
      ),
    );
  }
}

UPDATE FOR FIX:

If you edit like below code the app_routes class, the problem solves

/// [AppRouter] is the router of the app
@AutoRouterConfig(replaceInRouteName: AppRouter._replaceInRouteName)
final class AppRouter extends _$AppRouter {
  static const _replaceInRouteName = 'View,Route';
  @override
  List<AutoRoute> get routes => [
        AutoRoute(
          page: HomeRoute.page,
          initial: true,
          children: [
            AutoRoute(
              page: RootRoute.page,
            ),
            AutoRoute(page: DictionaryRoute.page),
            AutoRoute(page: OwnDictionaryRoute.page),
          ],
        ),
        AutoRoute(page: OTPRoute.page),
        AutoRoute(page: PhoneNumberVerificationRoute.page),
        AutoRoute(page: SignUpRoute.page),
      ];
}