fix: update comments list when a new comment is send

The comments list was static before. If an user posted a comment, even
after it was approved, the comments list was keeping the old state.

1 files changed, 41 insertions, 19 deletions

diff --git a/src/services/graphql/queries.ts b/src/services/graphql/queries.ts
index a9b3141..688d3f2 100644
--- a/src/services/graphql/queries.ts
+++ b/src/services/graphql/queries.ts
@@ -1,6 +1,7 @@
 import { Slug } from '@ts/types/app';
 import { Article, PostBy, TotalArticles } from '@ts/types/articles';
 import { AllPostsSlug, PostsList, RawPostsList } from '@ts/types/blog';
+import { Comment, CommentsByPostId } from '@ts/types/comments';
 import {
   AllTopics,
   AllTopicsSlug,
@@ -18,6 +19,8 @@ import {
   getFormattedPostPreview,
   getFormattedTopic,
   getFormattedThematic,
+  getFormattedComments,
+  buildCommentsTree,
 } from '@utils/helpers/format';
 import { gql } from 'graphql-request';
 import { fetchApi } from './api';
@@ -188,24 +191,6 @@ export const getPostBySlug = async (slug: string): Promise<Article> => {
           }
         }
         commentCount
-        comments(where: { order: ASC, orderby: COMMENT_DATE }) {
-          nodes {
-            approved
-            author {
-              node {
-                gravatarUrl
-                name
-                url
-              }
-            }
-            commentId
-            content
-            date
-            id
-            parentDatabaseId
-            parentId
-          }
-        }
         contentParts {
           afterMore
           beforeMore
@@ -242,7 +227,6 @@ export const getPostBySlug = async (slug: string): Promise<Article> => {
           opengraphTitle
           opengraphType
           opengraphUrl
-          readingTime
         }
         title
       }
@@ -255,6 +239,44 @@ export const getPostBySlug = async (slug: string): Promise<Article> => {
 };
 
 //==============================================================================
+// Comments query
+//==============================================================================
+
+export const getCommentsByPostId = async (id: number): Promise<Comment[]> => {
+  const query = gql`
+    query MyQuery($id: Int) {
+      postBy(postId: $id) {
+        comments(where: { order: ASC, orderby: COMMENT_DATE }) {
+          nodes {
+            approved
+            author {
+              node {
+                gravatarUrl
+                id
+                name
+                url
+              }
+            }
+            commentId
+            content
+            date
+            parentDatabaseId
+          }
+        }
+      }
+    }
+  `;
+
+  const variables = { id };
+  const response = await fetchApi<CommentsByPostId>(query, variables);
+  const formattedComments = getFormattedComments(
+    response.postBy.comments.nodes
+  );
+
+  return buildCommentsTree(formattedComments);
+};
+
+//==============================================================================
 // Topic query
 //==============================================================================