fix: Search endpoint results are now wrapped inside another object (#35)

* Increased API request delay on build.
* Improved search performance.

plugins/gatsby-source-animethemes/src/index.js

@@ -3,7 +3,7 @@ const withCache = require("./utils/withCache");
 
 const baseUrl = process.env.GATSBY_API_URL || "https://staging.animethemes.moe";
 
-const requestCooldown = 1000;
+const requestCooldown = 1500;
 let lastRequest;
 
 async function fetchJsonCached(url, init) {

src/components/search/global.js

@@ -12,7 +12,7 @@ import ArtistSearchResultCard from "components/card/searchResult/artist";
 import { Box, Flex } from "components/flex";
 
 export default function GlobalSearch({ searchQuery, searchEntity }) {
-    const [ results, isSearching ] = useSearch(searchQuery);
+    const [ results, isSearching ] = useSearch(searchQuery, searchEntity ? 15 : 4, searchEntity ? [ searchEntity ] : [ "anime", "theme", "artist" ]);
 
     if (!searchQuery) {
         return (

src/hooks/useSearch.js

@@ -2,16 +2,115 @@ import {useRef} from "react";
 import useSWR from "swr";
 import {baseUrl} from "../../plugins/gatsby-source-animethemes/src/index";
 
-const fields = [ "anime", "themes", "artists" ];
+const entityConfigs = {
+    anime: {
+        includes: [
+            "themes.entries.videos",
+            "images"
+        ],
+        fields: {
+            anime: [
+                "name",
+                "slug",
+                "year",
+                "season"
+            ],
+            theme: [
+                "type",
+                "sequence",
+                "slug"
+            ],
+            entry: [
+                "version"
+            ],
+            video: [
+                "resolution",
+                "nc",
+                "subbed",
+                "lyrics",
+                "uncen",
+                "source",
+                "overlap"
+            ],
+            image: [
+                "facet",
+                "link"
+            ]
+        }
+    },
+    theme: {
+        plural: "themes",
+        includes: [
+            "entries.videos",
+            "anime.images",
+            "song.artists"
+        ],
+        fields: {
+            anime: [
+                "name",
+                "slug",
+                "year",
+                "season"
+            ],
+            theme: [
+                "type",
+                "sequence",
+                "slug"
+            ],
+            entry: [
+                "version"
+            ],
+            video: [
+                "resolution",
+                "nc",
+                "subbed",
+                "lyrics",
+                "uncen",
+                "source",
+                "overlap"
+            ],
+            image: [
+                "facet",
+                "link"
+            ],
+            song: [
+                "title"
+            ],
+            artist: [
+                "name",
+                "slug",
+                "as"
+            ]
+        }
+    },
+    artist: {
+        plural: "artists",
+        includes: [
+            "images"
+        ],
+        fields: {
+            artist: [
+                "name",
+                "slug"
+            ],
+            image: [
+                "facet",
+                "link"
+            ]
+        }
+    }
+};
+
 const emptyResults = {
     animeResults: [],
     themeResults: [],
     artistResults: []
 };
 
-export default function useSearch(query) {
+export default function useSearch(query, limit = 3, entities = [ "anime", "theme", "artist" ]) {
+    const parameters = generateParameters(entities);
     const { data: results, isValidating } = useSWR(
-        `${baseUrl}/api/search?fields=${fields.join()}&q=${encodeURIComponent(query)}`,
+        `${baseUrl}/api/search?${parameters.join("&")}&limit=${limit}&q=${encodeURIComponent(query)}`,
         fetchSearchResults
     );
 
@@ -27,7 +126,7 @@ export default function useSearch(query) {
 
 async function fetchSearchResults(url) {
     const res = await fetch(url);
-    const { anime, themes, artists } = await res.json();
+    const { anime = [], themes = [], artists = [] } = (await res.json()).search;
 
     // Map artist to performances to comply with the application schema
     for (const theme of themes) {
@@ -43,3 +142,30 @@ async function fetchSearchResults(url) {
         artistResults: artists
     };
 }
+
+function generateParameters(entities) {
+    const parameters = [];
+
+    parameters.push(`fields[search]=${entities.map((entity) => entityConfigs[entity].plural || entity)}`);
+
+    parameters.push(
+        ...entities
+            .flatMap((entity) => {
+                const parameters = [];
+                const config = entityConfigs[entity];
+
+                if (config.includes) {
+                    parameters.push(`include[${entity}]=${config.includes.join(",")}`);
+                }
+
+                if (config.fields) {
+                    parameters.push(...Object.entries(config.fields).map(([key, fields]) => `fields[${key}]=${fields.join(",")}`));
+                }
+
+                return parameters;
+            })
+            .filter((parameter, index, parameters) => parameters.indexOf(parameter) === index)
+    );
+
+    return parameters;
+}