In my project, I'm running a fetch function. I've made it under a library component in the folder /library/data.js and it looks like this:
export async function GetData(query, variables) {
const { data } = await fetch(process.env.NEXT_PUBLIC_GRAPHQL_URL, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ query, variables }),
next: { revalidate: parseInt(process.env.REVALIDATE_TIME) },
}).then((res) => res.json());
return data;
}
Now this query seems to work for pretty much everything, building pages and all. However, although I had it working previously and nothing has changed about this component, it's decided that search functionality isn't going to work.
I've got a Search Page, which currently looks like this:
import SearchBox from "@/components/search/searchBox";
import SearchResults from "@/components/search/searchResults";
import { GetData } from "@/lib/data";
import { useRouter } from "next/router";
import { useEffect, useState } from "react";
import { SEARCH_RESULTS } from "@/data/search";
const GetResults = async (query) => {
const data = await GetData(SEARCH_RESULTS, { search: query });
const values = Object.values(data);
const results = [];
values.forEach((value) => {
if(value.edges.length) {
results.push(value.edges);
}
});
// flatten the array
const flatResults = [].concat.apply([], results);
return flatResults;
};
const SearchPage = () => {
const router = useRouter();
const { query } = router.query;
const [results, setResults] = useState([]);
useEffect(() => {
setResults([]);
if (query) {
GetResults(query).then((res) => {
setResults(res);
});
}
}, [query]);
return (
<div>
<h1>Search</h1>
<SearchBox className={'bg-black text-white border border-white rounded-md px-2 py-1'} />
<SearchResults results={results} query={query} />
</div>
)
}
export default SearchPage;
The <SearchBox /> is just an input that handles Debouncing and the pathname of the page, and the <SearchResults /> just helps flatten the array of the results.
But now when I attempt to run this, I get an error as pictures below: