Skip to content

Riverpod integration for NextAuth authentication in Flutter, providing reactive state management for session and authentication status.

License

Notifications You must be signed in to change notification settings

jcyuan/flutter_next_auth_riverpod

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

20 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

flutter_next_auth_riverpod

Riverpod integration for NextAuth.js in Flutter via flutter_next_auth_core, providing reactive state management for session and authentication status.

Features

  • App-wide scope: NextAuthRiverpodScope wires a NextAuthClient into Riverpod.
  • Reactive auth state: watch session/status via providers.
  • Auto refetch: optional periodic refetch and refetch when app returns to foreground.
  • Auth event stream: listen to auth lifecycle events (sign in/out, session/status changes).

Example Video:

riverpod_1080p.mp4

Installation

Add dependencies to your pubspec.yaml:

dependencies:
  flutter_next_auth_core: ^1.1.1
  flutter_next_auth_riverpod: ^1.0.10
  flutter_riverpod: ^3.1.0

NextAuthClient configuration

flutter_next_auth_riverpod uses NextAuthClient from flutter_next_auth_core. For the complete API reference and examples, see: NextAuthClient API reference.

Usage

1) Wrap your app with NextAuthRiverpodScope

import 'package:flutter/material.dart';
import 'package:flutter_next_auth_core/next_auth.dart';
import 'package:flutter_next_auth_riverpod/next_auth_riverpod.dart';

void main() {
  final config = NextAuthConfig(
    domain: 'https://example.com',
    authBasePath: '/api/auth',
    httpClient: /* your HttpClient */,
  );

  final client = NextAuthClient<YourSessionType>(config);

  runApp(
    NextAuthRiverpodScope<YourSessionType>(
      client: client,
      // in milliseconds
      refetchInterval: 30000,
      // default: true
      refetchOnWindowFocus: true,
      child: const MyApp(),
    ),
  );
}

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

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(home: SizedBox.shrink());
  }
}

2) Watch auth state with providers

flutter_next_auth_riverpod exposes these Riverpod providers:

  • statusProvider: Provider<SessionStatus> (initial, loading, authenticated, unauthenticated)
  • sessionProvider: Provider<Object?> (session data when authenticated, otherwise null)
  • authProvider: NotifierProvider<NextAuthRiverpodNotifier<Object>, NextAuthState<Object>>
  • authEventStreamProvider: StreamProvider<NextAuthEvent?>

Minimal example:

import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_next_auth_riverpod/next_auth_riverpod.dart';

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

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final status = ref.watch(statusProvider);
    final session = ref.watch(sessionProvider); // as YourSessionType?

    return Text('Status: ${status.name}, Session: ${session?.toString()}');
  }
}

If you use a custom session model, cast it:

final session = ref.watch(sessionProvider) as MySession?;

Example

See example/ for a complete integration project.

cd example
flutter pub get
flutter run

See also

Flutter NextAuth Core: https://github.com/jcyuan/flutter_next_auth_core
BLoC integration: https://github.com/jcyuan/flutter_next_auth_bloc

About

Riverpod integration for NextAuth authentication in Flutter, providing reactive state management for session and authentication status.

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published