The UI updates on one screen but doesn't update on another screen although I use the same controller and Obx on both of the screens

Viewed 21

enter image description here

enter image description here

I am showing a PostBuider widget on these two different screens.

MainScreen code:

Obx(
            () {
              return ListView.builder(
                  itemCount: postController.postList.length,
                  controller: postController.scrollController,
                  itemBuilder: (context, index) {
                    var postData = postController.postList[index];
                    return PostBuilder(post: postData);
                  });
            },
          ))

CommentScreen code:

Obx(
                () => Column(
              children: [
                SizedBox(
                  child: Column(
                    children: [

                      PostBuilder(
                        post: post,
                      ),

                      Expanded(
                        child: ListView.builder(
                            itemCount: commentController.comments.length,
                            itemBuilder: (context, index) {
                              final commentData = commentController.comments[index];
                              return CommentTile(
                                comment: commentData,
                              );
                            }),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          )),

The problem is with the like function which is inside a controller:

void likePost(String id) async {
    print(id);
    var querySnapshot =
        await fbFireStore.collection('posts').where('id', isEqualTo: id).get();
    var document = {};
    var documentId = '';
    for (var snapshot in querySnapshot.docs) {
      var docId = snapshot.id;
      Map<String, dynamic> data = snapshot.data();
      document = data;
      documentId = docId;
    }

    var uid = authController.user.uid;
    if (document['likes'].contains(uid)) {
      await fbFireStore.collection('posts').doc(documentId).update(
        {
          'likes': FieldValue.arrayRemove([uid]),
        },
      );
    } else {
      await fbFireStore.collection('posts').doc(documentId).update({
        'likes': FieldValue.arrayUnion([uid])
      });
    }
  }

When I tap on the like button on the main screen, it likes/unlikes and updates the UI accordingly. However when I click on it on the comments screen, although the function works (the id of the user is added/removed from the firestore database) the UI doesn't update.I also see the change when I go back to the main screen. I am initializing the controller and using Obx on both of the pages. How can I fix this issue?

0 Answers
Related