adrianhajdin / project_nextjs13_flexibble

https://jsmastery.pro
639 stars 133 forks source link

Unhandled Runtime Error Error: Field 'category': Error { message: "Field 'category': Error { message: \"invalid type: null, expected a string\", extensions: None }", #40

Open fuzanu opened 9 months ago

fuzanu commented 9 months ago

This is what Next.js compiler sends after i try to run up the finished application. i got this error while making the app, then i downloaded the final project and it has the same issue.

Unhandled Runtime Error Error: Field 'category': Error { message: "Field 'category': Error { message: \"invalid type: null, expected a string\", extensions: None }", extensions: None }: {"response":{"data":{"projectSearch":null},"errors":[{"message":"Field 'category': Error { message: \"Field 'category': Error { message: \\"invalid type: null, expected a string\\", extensions: None }\", extensions: None }","locations":[{"line":3,"column":5}],"path":["projectSearch"]}],"status":200,"headers":{}},"request":{"query":"\n query getProjects($category: String, $endcursor: String) {\n projectSearch(first: 8, after: $endcursor, filter: {category: {eq: $category}}) {\n pageInfo {\n hasNextPage\n hasPreviousPage\n startCursor\n endCursor\n }\n edges {\n node {\n title\n githubUrl\n description\n liveSiteUrl\n id\n image\n category\n createdBy {\n id\n email\n name\n avatarUrl\n }\n }\n }\n }\n }\n","variables":{}}}

Source lib\actions.ts (38:11) @ async makeGraphQLRequest

36 | const makeGraphQLRequest = async (query: string, variables = {}) => { 37 | try {

38 | return await client.request(query, variables); | ^ 39 | } catch (err) { 40 | throw err; 41 | } Call Stack async Home

shoaibakhtar800 commented 9 months ago

replace ur fetchAllProjects with this it will solve the problem `export const fetchAllProjects = (category?: string, endcursor?: string) => { client.setHeader('x-api-key', apiKey);

const query = category ? projectsQuery : getAllProjectsQuery; const variables = category ? { category, endcursor } : { endcursor };

return makeGraphQLRequest(query, variables); };`

fuzanu commented 9 months ago

hi! thanks for responding, unfortunately nothing has changed, it gives me the same error and i have no idea what to do about it. i have created another query in the graphql index named "getAllProjectsQuery", have changed category and endcursor types to not be null and i get the same error. i am new to typescript and it's so confusing cause there is no proper explanation about how to solve this.

shoaibakhtar800 commented 9 months ago

I have the same issue but I'm able to solve it, don't worry it's a common error you have to make some changes in action.ts. and also i will send you my graphql queries

shoaibakhtar800 commented 9 months ago

hi! thanks for responding, unfortunately nothing has changed, it gives me the same error and i have no idea what to do about it. i have created another query in the graphql index named "getAllProjectsQuery", have changed category and endcursor types to not be null and i get the same error. i am new to typescript and it's so confusing cause there is no proper explanation about how to solve this.

check out my repo i have developed that project n with updated code

shreyansh1410 commented 9 months ago

hey @shoaibakhtar800 you're a life saver

fuzanu commented 9 months ago

my man u rock!! thanks a lot!

israelmitolu commented 8 months ago

hi! thanks for responding, unfortunately nothing has changed, it gives me the same error and i have no idea what to do about it. i have created another query in the graphql index named "getAllProjectsQuery", have changed category and endcursor types to not be null and i get the same error. i am new to typescript and it's so confusing cause there is no proper explanation about how to solve this.

check out my repo i have developed that project n with updated code

Thanks a lot, man! I'd been stuck on the issue for days

Amir-Kermanshahani commented 8 months ago

hi! thanks for responding, unfortunately nothing has changed, it gives me the same error and i have no idea what to do about it. i have created another query in the graphql index named "getAllProjectsQuery", have changed category and endcursor types to not be null and i get the same error. i am new to typescript and it's so confusing cause there is no proper explanation about how to solve this.

check out my repo i have developed that project n with updated code

Thanks a lot, man! I'd been stuck on the issue for days

That was a relief man, Thanks a lot. I was so happy when I found someone has corrected the mistake.

pemawangchuk2023 commented 7 months ago

I too had same problem but applied as shoaibakhtar800 stated. It worked. Thanks.