refactor(services, types): reorganize GraphQL fetchers and data types

The Typescript mapped types was useful for autocompletion in fetchers
but their are harder to maintain. I think it's better to keep each
query close to its fetcher to have a better understanding of the
fetched data. So I:
* colocate queries with their own fetcher
* colocate mutations with their own mutator
* remove Typescript mapped types for queries and mutations
* move data convertors inside graphql services
* rename most of data types and fetchers

1 files changed, 15 insertions, 6 deletions

diff --git a/src/utils/hooks/use-comments.ts b/src/utils/hooks/use-comments.ts
index ac723e9..94a2d7e 100644
--- a/src/utils/hooks/use-comments.ts
+++ b/src/utils/hooks/use-comments.ts
@@ -1,9 +1,13 @@
 import useSWR from 'swr';
-import { getAllComments } from '../../services/graphql';
+import {
+  type FetchCommentsListInput,
+  fetchCommentsList,
+  convertWPCommentToComment,
+  buildCommentsTree,
+} from '../../services/graphql';
 import type { SingleComment } from '../../types';
 
-export type UseCommentsConfig = {
-  contentId?: string | number;
+export type UseCommentsConfig = FetchCommentsListInput & {
   fallback?: SingleComment[];
 };
 
@@ -14,10 +18,15 @@ export type UseCommentsConfig = {
  * @returns {SingleComment[]|undefined}
  */
 export const useComments = ({
-  contentId,
   fallback,
+  ...input
 }: UseCommentsConfig): SingleComment[] | undefined => {
-  const { data } = useSWR(contentId ? { contentId } : null, getAllComments, {});
+  const { data } = useSWR(input, fetchCommentsList, {});
 
-  return data ?? fallback;
+  if (!data) return fallback;
+
+  const comments = data.map(convertWPCommentToComment);
+  const commentsTree = buildCommentsTree(comments);
+
+  return commentsTree;
 };