feat: create routes to load popular titles

src/controllers/search/anilist.ts

@@ -2,28 +2,27 @@ import { graphql } from "gql.tada";
 import { GraphQLClient } from "graphql-request";
 
 import { sleep } from "~/libs/sleep";
+import { HomeTitleFragment } from "~/types/title/homeTitle";
 
-const SearchQuery = graphql(`
-  query Search($query: String!, $page: Int!, $limit: Int!) {
-    Page(page: $page, perPage: $limit) {
-      media(search: $query, type: ANIME, sort: [POPULARITY_DESC, SCORE_DESC]) {
-        id
-        title {
-          userPreferred
-          english
+const SearchQuery = graphql(
+  `
+    query Search($query: String!, $page: Int!, $limit: Int!) {
+      Page(page: $page, perPage: $limit) {
+        media(
+          search: $query
+          type: ANIME
+          sort: [POPULARITY_DESC, SCORE_DESC]
+        ) {
+          ...HomeTitle
         }
-        coverImage {
-          extraLarge
-          large
-          medium
+        pageInfo {
+          hasNextPage
         }
       }
-      pageInfo {
-        hasNextPage
-      }
     }
-  }
-`);
+  `,
+  [HomeTitleFragment],
+);
 
 export async function fetchSearchResultsFromAnilist(
   query: string,