# Go Router + Riverpod Tutorials Series 4: Role Based Redirection

Now let's take a look at redirection depending on user roles

Source code: [role\_based\_redirection](https://github.com/khkred/go_router_riverpod_tutorials/tree/role_based_redirection)

Now, Let's update our files starting with :

### AuthNotifier and authProvider:

This is the updated `AuthNotifier`

```dart
class AuthNotifier extends StateNotifier<Map<String, dynamic>> {
  AuthNotifier() : super({'loggedIn': false, 'role': 'guest'});

  void login(String role) {
    state = {'loggedIn': true, 'role': role};
    print('State change to true,  Logged in as $role');
  }

  void logout() {
    state = {'loggedIn': false, 'role': 'guest'};
    print('State change to false, Logged out');
  }
}
```

This is the updated `authProvider`

```dart
final authProvider = StateNotifierProvider<AuthNotifier, Map<String, dynamic>>((ref) {
  return AuthNotifier();
});
```

### Update app\_router

First since we are getting a map instead of bool. Let's get a update our `redirectIfNotLoggedIn()`

```dart
FutureOr<String?> redirectIfNotLoggedIn(ProviderRef ref) {
  final loggedIn = ref.watch(authProvider)['loggedIn'];
  if (!loggedIn) {
    return '/login';
  }
  return null;
}
```

Now for the `AdminPage()` route. Let's make sure that only admin role should be able to see the page. So we'll update the `redirect` of the /`admin` route.

```dart
  GoRoute(
          path: '/admin',
          builder: (context, state) => const AdminPage(),
          redirect: (context, state) {
            final loggedIn = ref.watch(authProvider)['loggedIn'];
            final role = ref.watch(authProvider)['role'];
            if (!loggedIn) {
              return '/login';
            }
            if(role != 'admin'){
              return '/home';
            }
            return null;
          },
        )
```

Now let's update our existing pages to use the new roles property.

### HomePage

```dart
class HomePage extends ConsumerWidget {
  const HomePage({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('GRT Redirect'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            const Text('Home Page'),
            const SizedBox(height: 20),
            ElevatedButton(
                onPressed: () {
                  ref.read(authProvider.notifier).logout();
                },
                child: const Text('Logout')),
            const SizedBox(height: 20),
            ElevatedButton(
                onPressed: () {
                  context.go('/home/profile');
                },
                child: const Text('Go to Profile')),
            const SizedBox(height: 20),
            ElevatedButton(
                onPressed: () {
                  context.go('/home/settings');
                },
                child: const Text('Go to Settings')),
            const SizedBox(height: 20),
            ElevatedButton(
                onPressed: () {
                  context.go('/admin');
                },
                child: const Text('Go to Admin')),
          ],
        ),
      ),
    );
  }
}
```

### LoginPage:

We are updating the login page to allow logging in as either a regular user or an admin.

```dart
class LoginPage extends ConsumerWidget {
  const LoginPage({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('GRT Login'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            const Text('This is Login Page'),
            const SizedBox(height: 20),
            ElevatedButton(
                onPressed: () {
                  ref.read(authProvider.notifier).login('user');
                },
                child: const Text('Login as User')),
            const SizedBox(height: 20),
            ElevatedButton(
                onPressed: () {
                  ref.read(authProvider.notifier).login('admin');
                },
                child: const Text('Login as Admin')),
          ],
        ),
      ),
    );
  }
}
```

Alright so let's test the code

![Login as admin and user](https://media4.giphy.com/media/v1.Y2lkPTc5MGI3NjExZGdpNmVidTE1ZHVhNmV5MTRzeW16Y2dpcmk2cjk2ejUxd3Q4dm5rNCZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/fmj58Jx0M2PHZJopXQ/giphy.gif align="center")

So this code works perfect. As always you can find the code for this tutorial here: [role\_based\_redirection](https://github.com/khkred/go_router_riverpod_tutorials/tree/role_based_redirection)