Update comment count when adding a comment

lib/viewmodels/comments_view_model.dart

@@ -6,6 +6,7 @@ import "package:proxima/models/database/post/post_id_firestore.dart";
 import "package:proxima/models/ui/comment_details.dart";
 import "package:proxima/services/database/comment/comment_repository_service.dart";
 import "package:proxima/services/database/user_repository_service.dart";
+import "package:proxima/viewmodels/post_comment_count_view_model.dart";
 
 /// This view model is used to fetch the comments of a post.
 /// It fetches the comments under the post with the id [arg] and returns
@@ -21,6 +22,9 @@ class CommentsViewModel extends AutoDisposeFamilyAsyncNotifier<
 
     final commentsFirestore = await commentRepository.getPostComments(arg);
 
+    // Update the post comment count
+    ref.read(postCommentCountProvider(arg).notifier).refresh();
+
     final commentOwnersId =
         commentsFirestore.map((comment) => comment.data.ownerId).toSet();
 

lib/viewmodels/post_comment_count_view_model.dart

@@ -0,0 +1,28 @@
+import "package:hooks_riverpod/hooks_riverpod.dart";
+import "package:proxima/models/database/post/post_id_firestore.dart";
+import "package:proxima/services/database/post_repository_service.dart";
+
+/// This view model is used to keep in memory the number of comments of a post.
+/// It is refreshed every time the post comment list is refreshed, to stay consistent
+/// with it. It is also refreshed when a comment is deleted.
+/// This cannot be auto-dispose because, otherwise, it might get unmounted in the middle
+/// of its refresh method. See https://github.com/rrousselGit/riverpod/discussions/2502.
+class PostCommentCountViewModel
+    extends FamilyAsyncNotifier<int, PostIdFirestore> {
+  @override
+  Future<int> build(PostIdFirestore arg) async {
+    final postRepo = ref.watch(postRepositoryServiceProvider);
+    final post = await postRepo.getPost(arg);
+    return post.data.commentCount;
+  }
+
+  Future<void> refresh() async {
+    state = const AsyncValue.loading();
+    state = await AsyncValue.guard(() => build(arg));
+  }
+}
+
+final postCommentCountProvider = AsyncNotifierProvider.family<
+    PostCommentCountViewModel, int, PostIdFirestore>(
+  () => PostCommentCountViewModel(),
+);

lib/viewmodels/user_comments_view_model.dart

@@ -5,6 +5,7 @@ import "package:proxima/models/database/post/post_id_firestore.dart";
 import "package:proxima/models/ui/user_comment_details.dart";
 import "package:proxima/services/database/comment/comment_repository_service.dart";
 import "package:proxima/viewmodels/login_view_model.dart";
+import "package:proxima/viewmodels/post_comment_count_view_model.dart";
 import "package:proxima/viewmodels/posts_feed_view_model.dart";
 
 typedef UserCommentsState = List<UserCommentDetails>;
@@ -53,6 +54,8 @@ class UserCommentViewModel extends AutoDisposeAsyncNotifier<UserCommentsState> {
     // Refresh the home feed after comment deletion, that way the comment
     // count will be updated
     ref.read(postsFeedViewModelProvider.notifier).refresh();
+    // Also update the comment count for the post
+    ref.read(postCommentCountProvider(postId).notifier).refresh();
   }
 
   /// Refresh the list of posts

lib/views/pages/home/content/feed/components/comment_count.dart

@@ -1,17 +1,23 @@
 import "package:flutter/material.dart";
+import "package:hooks_riverpod/hooks_riverpod.dart";
+import "package:proxima/models/database/post/post_id_firestore.dart";
+import "package:proxima/viewmodels/post_comment_count_view_model.dart";
 
 /// This widget is used to display the comment number in the post card.
 /// It contains the comment icon and the number of comments.
-class CommentCount extends StatelessWidget {
-  final int count;
+class CommentCount extends ConsumerWidget {
+  final PostIdFirestore postId;
 
   const CommentCount({
     super.key,
-    required this.count,
+    required this.postId,
   });
 
   @override
-  Widget build(BuildContext context) {
+  Widget build(BuildContext context, WidgetRef ref) {
+    final asyncCount = ref.watch(postCommentCountProvider(postId));
+    final count = asyncCount.value ?? 0;
+
     const icon = Icon(Icons.comment, size: 20);
     final countText = Text(count.toString());
 

lib/views/pages/home/content/feed/components/post_card.dart

@@ -79,7 +79,7 @@ class PostCard extends ConsumerWidget {
             onTap: () => _onPostSelect(context, postDetails, ref),
             child: CommentCount(
               key: postCardCommentsNumberKey,
-              count: postDetails.commentNumber,
+              postId: postDetails.postId,
             ),
           ),
         ],

test/end2end/app_actions.dart

@@ -322,11 +322,21 @@ class AppActions {
     await tester.pumpAndSettle();
 
     // Check that the post content is displayed
-    expect(find.text(comment), findsOneWidget);
+    final commentText = find.text(comment);
+    expect(commentText, findsOneWidget);
 
-    // Find the delete button on card
-    final deleteButton = find.byKey(ProfileInfoCard.deleteButtonCardKey);
-    expect(deleteButton, findsOneWidget);
+    // Find and tap the delete button on the card
+    final commentCard = find.ancestor(
+      of: commentText,
+      matching: find.byKey(ProfileInfoCard.infoCardKey),
+    );
+    expect(commentCard, findsOne);
+
+    final deleteButton = find.descendant(
+      of: commentCard,
+      matching: find.byKey(ProfileInfoCard.deleteButtonCardKey),
+    );
+    expect(deleteButton, findsOne);
 
     await tester.tap(deleteButton);
     await tester.pumpAndSettle(delayNeededForAsyncFunctionExecution);

test/end2end/app_test.dart

@@ -11,7 +11,6 @@ import "package:proxima/services/database/firestore_service.dart";
 import "package:proxima/services/sensors/geolocation_service.dart";
 import "package:proxima/views/navigation/bottom_navigation_bar/navigation_bar_routes.dart";
 import "package:proxima/views/pages/home/content/challenge/challenge_list.dart";
-import "package:proxima/views/pages/home/content/feed/post_feed.dart";
 import "package:proxima/views/pages/profile/components/profile_app_bar.dart";
 import "package:proxima/views/proxima_app.dart";
 
@@ -161,17 +160,19 @@ void main() {
     await AppActions.loginToCreateAccount(tester);
     await AppActions.createAccountToHome(tester);
     await AppActions.createPost(tester, testPostTitle, testPostDescription);
-    await AppActions.openPost(tester, testPostTitle);
-    const comment = "I like turtles too!";
-    await AppActions.addComment(tester, comment);
-
-    // back to feed
-    await AppActions.navigateBack(tester);
-    await AppActions.flingRefresh(tester, find.byType(PostFeed));
+    await AppActions.expectCommentCount(tester, testPostTitle, 0);
+
+    // Add two comments
+    const comments = ["I like turtles too!", "I prefer elephants"];
+    for (final (i, comment) in comments.indexed) {
+      await AppActions.openPost(tester, testPostTitle);
+      await AppActions.addComment(tester, comment);
+      await AppActions.navigateBack(tester);
+      await AppActions.expectCommentCount(tester, testPostTitle, i + 1);
+    }
 
-    // expect comment count to be correct
-    AppActions.expectCommentCount(tester, testPostTitle, 1);
-    await AppActions.deleteComment(tester, comment);
-    AppActions.expectCommentCount(tester, testPostTitle, 0);
+    // Deleting a comment should reduce the comment count
+    await AppActions.deleteComment(tester, comments.first);
+    await AppActions.expectCommentCount(tester, testPostTitle, 1);
   });
 }

test/mocks/overrides/override_post_comment_count_view_model.dart

@@ -0,0 +1,30 @@
+import "package:hooks_riverpod/hooks_riverpod.dart";
+import "package:proxima/models/database/post/post_id_firestore.dart";
+import "package:proxima/viewmodels/post_comment_count_view_model.dart";
+
+/// A mock implementation of the [PostCommentCountViewModel] class.
+/// Its state is always the same and can be set in the constructor.
+class MockPostCommentCountViewModel
+    extends FamilyAsyncNotifier<int, PostIdFirestore>
+    implements PostCommentCountViewModel {
+  final int count;
+
+  /// Creates a new [MockPostCommentCountViewModel] with the given [count],
+  /// which is the value that will always be returned by this view-model.
+  MockPostCommentCountViewModel({this.count = 0});
+
+  @override
+  Future<int> build(PostIdFirestore arg) async {
+    return count;
+  }
+
+  @override
+  Future<void> refresh() async {
+    state = const AsyncValue.loading();
+    state = await AsyncValue.guard(() => build(arg));
+  }
+}
+
+final zeroPostCommentCountOverride = [
+  postCommentCountProvider.overrideWith(() => MockPostCommentCountViewModel()),
+];

test/mocks/overrides/override_posts_feed_view_model.dart

@@ -4,6 +4,7 @@ import "package:proxima/models/ui/post_details.dart";
 import "package:proxima/viewmodels/posts_feed_view_model.dart";
 
 import "../data/post_overview.dart";
+import "override_post_comment_count_view_model.dart";
 
 /// A mock implementation of the [PostsFeedViewModel] class.
 /// This class is particularly useful for the UI tests where we want to expose
@@ -35,6 +36,8 @@ final mockNonEmptyHomeViewModelOverride = [
   postsFeedViewModelProvider.overrideWith(
     () => MockPostsFeedViewModel(build: () async => testPosts),
   ),
+  // The posts don't exist in the database, so we also override their comment count to 0
+  ...zeroPostCommentCountOverride,
 ];
 
 final mockLoadingHomeViewModelOverride = [

test/viewmodels/post_comment_count_view_model_integration_test.dart

@@ -0,0 +1,134 @@
+import "package:collection/collection.dart";
+import "package:fake_cloud_firestore/fake_cloud_firestore.dart";
+import "package:flutter_test/flutter_test.dart";
+import "package:hooks_riverpod/hooks_riverpod.dart";
+import "package:mockito/mockito.dart";
+import "package:proxima/models/database/comment/comment_firestore.dart";
+import "package:proxima/models/database/post/post_firestore.dart";
+import "package:proxima/models/database/post/post_id_firestore.dart";
+import "package:proxima/services/database/comment/comment_repository_service.dart";
+import "package:proxima/services/database/firestore_service.dart";
+import "package:proxima/services/sensors/geolocation_service.dart";
+import "package:proxima/viewmodels/comments_view_model.dart";
+import "package:proxima/viewmodels/login_view_model.dart";
+import "package:proxima/viewmodels/post_comment_count_view_model.dart";
+import "package:proxima/viewmodels/user_comments_view_model.dart";
+
+import "../mocks/data/comment_data.dart";
+import "../mocks/data/firestore_post.dart";
+import "../mocks/data/firestore_user.dart";
+import "../mocks/data/geopoint.dart";
+import "../mocks/services/mock_geo_location_service.dart";
+import "../mocks/services/setup_firebase_mocks.dart";
+import "../utils/delay_async_func.dart";
+
+void main() {
+  late MockGeolocationService geoLocationService;
+  late FakeFirebaseFirestore fakeFireStore;
+  late ProviderContainer container;
+
+  late CommentRepositoryService commentRepository;
+
+  setUp(() {
+    setupFirebaseAuthMocks();
+
+    geoLocationService = MockGeolocationService();
+    fakeFireStore = FakeFirebaseFirestore();
+    when(geoLocationService.getCurrentPosition()).thenAnswer(
+      (_) async => userPosition0,
+    );
+
+    container = ProviderContainer(
+      overrides: [
+        geolocationServiceProvider.overrideWithValue(geoLocationService),
+        loggedInUserIdProvider.overrideWithValue(testingUserFirestoreId),
+        firestoreProvider.overrideWithValue(fakeFireStore),
+      ],
+    );
+
+    commentRepository = container.read(commentRepositoryServiceProvider);
+  });
+
+  Future<void> expectCommentCount(
+    PostIdFirestore postId,
+    int expectedCount,
+  ) async {
+    final actualCount = await container.read(
+      postCommentCountProvider(postId).future,
+    );
+    expect(actualCount, equals(expectedCount));
+  }
+
+  group("Comment count refresh", () {
+    const int startCommentCount = 5;
+    late PostFirestore post;
+    late List<CommentFirestore> comments;
+
+    setUp(() async {
+      // Create and add a post to the database
+      final postGenerator = FirestorePostGenerator();
+      post = postGenerator.generatePostAt(userPosition0);
+      await setPostFirestore(post, fakeFireStore);
+
+      // Create comments
+      final commentDataGenerator = CommentDataGenerator();
+      final commentDatas = List.generate(
+        startCommentCount,
+        (_) => commentDataGenerator.createMockCommentData(
+          ownerId: testingUserFirestoreId,
+        ),
+      ).toList();
+
+      // Add the comments to the database
+      final commentIds = await Future.wait(
+        commentDatas.map(
+          (commentData) => commentRepository.addComment(post.id, commentData),
+        ),
+      );
+
+      comments = commentIds
+          .mapIndexed(
+            (i, id) => CommentFirestore(id: id, data: commentDatas[i]),
+          )
+          .toList();
+    });
+
+    test("Refresh on comment list refresh", () async {
+      await expectCommentCount(post.id, startCommentCount);
+
+      // Add a new comment
+      final newComment = CommentDataGenerator().createMockCommentData();
+      await commentRepository.addComment(post.id, newComment);
+
+      // This should not have refreshed for now
+      await expectCommentCount(post.id, startCommentCount);
+
+      // Refresh the comment list
+      await container
+          .read(commentsViewModelProvider(post.id).notifier)
+          .refresh();
+      await Future.delayed(delayNeededForAsyncFunctionExecution);
+
+      // The comment count should now be updated
+      await expectCommentCount(post.id, startCommentCount + 1);
+    });
+
+    test("Refresh on comment deletion in view-model", () async {
+      await expectCommentCount(post.id, startCommentCount);
+
+      // Delete the post
+      final comment = comments.first;
+      final userCommentViewModel = container.read(
+        userCommentsViewModelProvider.notifier,
+      );
+      await userCommentViewModel.deleteComment(
+        post.id,
+        comment.id,
+      );
+      await Future.delayed(delayNeededForAsyncFunctionExecution);
+
+      // The comment count should now be 1 less
+      await expectCommentCount(post.id, startCommentCount - 1);
+    });
+  });
+}