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

2 files changed, 32 insertions, 22 deletions

diff --git a/src/utils/hooks/use-posts-list/use-posts-list.test.ts b/src/utils/hooks/use-posts-list/use-posts-list.test.ts
index 1d11111..ff69de2 100644
--- a/src/utils/hooks/use-posts-list/use-posts-list.test.ts
+++ b/src/utils/hooks/use-posts-list/use-posts-list.test.ts
@@ -1,13 +1,13 @@
 import { describe, expect, it } from '@jest/globals';
 import { act, renderHook } from '@testing-library/react';
-import { getArticles } from '../../../services/graphql';
+import { fetchPostsList } from '../../../services/graphql';
 import { usePostsList } from './use-posts-list';
 
 describe('usePostsList', () => {
   it('can return the first new result index when loading more posts', async () => {
     const perPage = 5;
     const { result } = renderHook(() =>
-      usePostsList({ fetcher: getArticles, perPage })
+      usePostsList({ fetcher: fetchPostsList, perPage })
     );
 
     expect.assertions(2);
diff --git a/src/utils/hooks/use-posts-list/use-posts-list.ts b/src/utils/hooks/use-posts-list/use-posts-list.ts
index 980d531..bb77f31 100644
--- a/src/utils/hooks/use-posts-list/use-posts-list.ts
+++ b/src/utils/hooks/use-posts-list/use-posts-list.ts
@@ -1,29 +1,34 @@
-import { useCallback, useEffect, useState } from 'react';
-import type { PostData } from '../../../components';
-import type { Maybe, RawArticle } from '../../../types';
-import { getPostsList } from '../../helpers';
+import { useCallback, useState } from 'react';
+import type {
+  ArticlePreview,
+  GraphQLConnection,
+  GraphQLEdge,
+  Maybe,
+  WPPostPreview,
+} from '../../../types';
 import {
   type UsePaginationConfig,
   usePagination,
   type UsePaginationReturn,
 } from '../use-pagination';
+import { convertPostPreviewToArticlePreview } from 'src/services/graphql';
 
 export type usePostsListReturn = Omit<
-  UsePaginationReturn<RawArticle>,
+  UsePaginationReturn<WPPostPreview>,
   'data'
 > & {
   /**
-   * The index of the first new result when loading more posts.
+   * The articles list.
    */
-  firstNewResultIndex: Maybe<number>;
+  articles: Maybe<GraphQLConnection<ArticlePreview>[]>;
   /**
-   * The posts list.
+   * The index of the first new result when loading more posts.
    */
-  posts: Maybe<PostData[]>;
+  firstNewResultIndex: Maybe<number>;
 };
 
 export const usePostsList = (
-  config: UsePaginationConfig<RawArticle>
+  config: UsePaginationConfig<WPPostPreview>
 ): usePostsListReturn => {
   const {
     data,
@@ -40,15 +45,6 @@ export const usePostsList = (
   } = usePagination(config);
   const [firstNewResultIndex, setFirstNewResultIndex] =
     useState<Maybe<number>>(undefined);
-  const [posts, setPosts] = useState<Maybe<PostData[]>>(undefined);
-
-  useEffect(() => {
-    const getPosts = async () => {
-      if (data) setPosts(await getPostsList(data));
-    };
-
-    getPosts();
-  }, [data]);
 
   const handleLoadMore = useCallback(async () => {
     setFirstNewResultIndex(size * config.perPage + 1);
@@ -56,7 +52,22 @@ export const usePostsList = (
     await loadMore();
   }, [config.perPage, loadMore, size]);
 
+  const articles: Maybe<GraphQLConnection<ArticlePreview>[]> = data?.map(
+    (page): GraphQLConnection<ArticlePreview> => {
+      return {
+        edges: page.edges.map((edge): GraphQLEdge<ArticlePreview> => {
+          return {
+            cursor: edge.cursor,
+            node: convertPostPreviewToArticlePreview(edge.node),
+          };
+        }),
+        pageInfo: page.pageInfo,
+      };
+    }
+  );
+
   return {
+    articles,
     error,
     firstNewResultIndex,
     hasNextPage,
@@ -67,7 +78,6 @@ export const usePostsList = (
     isRefreshing,
     isValidating,
     loadMore: handleLoadMore,
-    posts,
     size,
   };
 };