Flutter Dynamic Screen Change and Nested Routing with GetX (Dashboard)

Question

I am new to flutter and currently developing a dashboard for the client. I am stuck with some issue, I created a dummy app now to test my implementations. The issue I am getting is I have a menu contents at left side and have main contents on the right side(in which my screens should change), but when I tapped on the items from menu it's rebuilding my whole dashboard. After some changes I managed to give proper nested route names but still unable to change my screens and when i tapped on the items from menu it is taking me to the new page.. and I am unable to stay on my dashboard. Providing My Code, Help me out with this dynamic screen change and routes.

import 'package:flutter/material.dart';
import 'package:get/get.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return GetMaterialApp(
      initialRoute: '/dashboard',
      getPages: [
        GetPage(
          name: '/dashboard',
          page: () => const DashboardScreen(),
          children: [
            GetPage(
              name: '/home',
              page: () => const HomeScreen(),
            ),
            GetPage(
              name: '/accounts',
              page: () => const AccountsScreen(),
              children: [
                GetPage(
                  name: '/customers',
                  page: () => const CustomersScreen(),
                ),
              ],
            ),
            GetPage(
              name: '/profile',
              page: () => const ProfileScreen(),
            ),
          ],
        ),
      ],
    );
  }
}

class DashboardScreen extends StatelessWidget {
  const DashboardScreen({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Dashboard')),
      body: Row(
        children: [
          // Sidebar navigation menu
          const NavigationSidebar(),
          Expanded(
            child: GetRouterOutlet(
              initialRoute: '/dashboard/home',
            ),
          ),
        ],
      ),
    );
  }
}

class NavigationSidebar extends StatelessWidget {
  const NavigationSidebar({super.key});

  @override
  Widget build(BuildContext context) {
    return Drawer(
      child: ListView(
        children: [
          ListTile(
            title: const Text('Home'),
            onTap: () {
              Get.toNamed('/dashboard/home');
            },
          ),
          ListTile(
            title: const Text('Accounts'),
            onTap: () {
              Get.toNamed('/dashboard/accounts');
            },
          ),
          ListTile(
            title: const Text('Profile'),
            onTap: () {
              Get.toNamed('/dashboard/profile');
            },
          ),
        ],
      ),
    );
  }
}

This is the part where change of screens should happen as well as my route name and my whole dashboard should not rebuild.

Expanded(
    child: GetRouterOutlet(
        initialRoute: '/dashboard/home',
    ),
)

You can Also DM to know further.