Setting Up Stream For Real-time User Data

I'm trying to set up a stream such that if a user updates their data(like their name), it's displayed in real-time. Currently, It's already being updated in the firestore collection but I have to reload the in-app home page to actually see the updated value. I'm also using a custom UserData class.

class Home extends StatefulWidget {

  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
  final AuthService _auth = AuthService();

  User user = FirebaseAuth.instance.currentUser;

  DatabaseService db = DatabaseService(uid: FirebaseAuth.instance.currentUser.uid);

  void _showSettingsPanel(){
    showModalBottomSheet(context: context, builder: (context){
      return Container(
        padding: EdgeInsets.symmetric(vertical: 20.0, horizontal: 60.0),
        child: SettingsForm(),
      );
    });
  }

  @override
  Widget build(BuildContext context) {
    return StreamProvider<UserData>.value( // need to setup this stream
      value: DatabaseService().userData,
      child: Scaffold(
          backgroundColor: Colors.redAccent,
          appBar: AppBar(
            title: Text('Signed in'),
            backgroundColor: Colors.blueAccent,
            elevation: 0.0, //no drop shadow
            actions: <Widget>[
              FlatButton.icon(
                  onPressed: () async {
                    await _auth.signOutUser();
                  },
                  icon: Icon(Icons.person),
                  label: Text('logout')),
              FlatButton.icon(
                icon: Icon(Icons.settings),
                label: Text('Settings'),
                onPressed: () => _showSettingsPanel(),
              )
            ],
          ),
          body: FutureBuilder(
            future: db.getProfile(),
            builder: (context, snapshot){
              if (snapshot.connectionState == ConnectionState.done){
                return ListTile(
                  leading: CircleAvatar(
                    radius: 25.0,
                    backgroundColor: Colors.brown,
                  ),
                  title: Text(snapshot.data),
                  tileColor: Colors.white,
                );
              }
              else {
                return CircularProgressIndicator();
              }
            },
          )
      ),
    );
  }
}

No need for a StreamProvider, you just need a StreamBuilder!

You already have the uid, so you just have to listen to the stream from Firestore.

Here is an example.

StreamBuilder<DocumentSnapshot>(
  stream:
      FirebaseFirestore.instance.collection('users').doc(uid).snapshots(),
  builder: (context, snapshot) {
    if (snapshot.connectionState != ConnectionState.active) {
      return Center(child: CircularProgressIndicator());
    }
    return ListTile(
      leading: CircleAvatar(
        radius: 25.0,
        backgroundColor: Colors.brown,
      ),
      title: Text(snapshot.data.data()['name']),
      tileColor: Colors.white,
    );
  },
);