'streamChatState != null': You must have a StreamChat widget at the top of your widget tree

Question

I am new to flutter and im trying to run a chat app with getstream chat api and firebase. I keep running into an error every time i try to sign in or sign up

Screenshot

this is main.dart this is my sign_in_screen.dart

class SignInScreen extends StatefulWidget {
  static Route get route => MaterialPageRoute(
        builder: (context) => const SignInScreen(),
      );
  const SignInScreen({Key? key}) : super(key: key);

  @override
  State<SignInScreen> createState() => _SignInScreenState();
}

class _SignInScreenState extends State<SignInScreen> {
  final auth = firebase.FirebaseAuth.instance;
  final functions = FirebaseFunctions.instance;

  final _formKey = GlobalKey<FormState>();
  final _emailController = TextEditingController();
  final _passwordController = TextEditingController();
  final _emailRegex = RegExp(
      r"^[a-zA-Z0-9.a-zA-Z0-9.!#$%&'*+-/=?^_`{|}~]+@[a-zA-Z0-9]+\.[a-zA-Z]+");

  bool _loading = false;

  Future<void> _signIn() async {
    if (_formKey.currentState!.validate()) {
      setState(() {
        _loading = true;
      });
      try {
        // Authenticate with Firebase
        final creds =
            await firebase.FirebaseAuth.instance.signInWithEmailAndPassword(
          email: _emailController.text,
          password: _passwordController.text,
        );

        final user = creds.user;

        if (user == null) {
          ScaffoldMessenger.of(context).showSnackBar(
            const SnackBar(content: Text('User is empty')),
          );
          return;
        }

        // Get Stream user token from Firebase Functions
        final callable = functions.httpsCallable('getStreamUserToken');
        final results = await callable();

        // Connnect stream user
        final client = StreamChatCore.of(context).client;
        await client.connectUser(
          User(id: creds.user!.uid),
          results.data,
        );

        // Navigate to home screen
        await Navigator.of(context).pushReplacementNamed(Routes.HOME);
      } on firebase.FirebaseAuthException catch (e) {
        ScaffoldMessenger.of(context).showSnackBar(
          SnackBar(content: Text(e.message ?? 'Auth error')),
        );
      } catch (e, st) {
        logger.e('Sign in error, ', e, st);
        ScaffoldMessenger.of(context).showSnackBar(
          const SnackBar(content: Text('An error occured')),
        );
      }
      setState(() {
        _loading = false;
      });
    }
  }

this is my home_page.dart

I tried looking online for answers but none worked.

Answer 1

It looks like you don't have a StreamChat widget in your widget tree; in order to use the Stream Chat Flutter SDK properly, you'll need this widget near the root of your widget tree.

Check out this example from the stream_chat_flutter package for how to do this.