fix: Page error codes (#116)

CHANGELOG.md

@@ -18,6 +18,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Removed
 
 ### Fixed
+- Status code when error occurs (404/500) ([#116](https://github.com/vtex-sites/nextjs.store/pull/116))
 
 ### Security
 

package.json

@@ -30,9 +30,9 @@
     "@envelop/graphql-jit": "^1.1.1",
     "@envelop/parser-cache": "^2.2.0",
     "@envelop/validation-cache": "^2.2.0",
-    "@faststore/api": "^1.9.3",
-    "@faststore/sdk": "^1.9.2",
-    "@faststore/ui": "^1.9.2",
+    "@faststore/api": "^1.9.6",
+    "@faststore/sdk": "^1.9.4",
+    "@faststore/ui": "^1.9.4",
     "@vtex/graphql-utils": "^1.8.42",
     "graphql": "^15.0.0",
     "include-media": "^1.4.10",

src/pages/[...slug].tsx

@@ -1,3 +1,4 @@
+import { isNotFoundError } from '@faststore/api'
 import {
   formatSearchState,
   parseSearchState,
@@ -166,24 +167,26 @@ export const getStaticProps: GetStaticProps<
 > = async ({ params }) => {
   const slug = params?.slug.join('/') ?? ''
 
-  const { data, errors } = await execute<
+  const { data, errors = [] } = await execute<
     ServerCollectionPageQueryQueryVariables,
     ServerCollectionPageQueryQuery
   >({
     variables: { slug },
     operationName: query,
   })
 
-  if (errors?.length > 0) {
-    throw new Error(`${errors[0]}`)
-  }
+  const notFound = errors.find(isNotFoundError)
 
-  if (data === null) {
+  if (notFound) {
     return {
       notFound: true,
     }
   }
 
+  if (errors.length > 0) {
+    throw errors[0]
+  }
+
   return {
     props: data,
   }

src/pages/[slug]/p.tsx

@@ -3,6 +3,7 @@ import { gql } from '@vtex/graphql-utils'
 import { BreadcrumbJsonLd, NextSeo, ProductJsonLd } from 'next-seo'
 import { useRouter } from 'next/router'
 import type { GetStaticPaths, GetStaticProps } from 'next'
+import { isNotFoundError } from '@faststore/api'
 
 import ProductDetails from 'src/components/sections/ProductDetails'
 import ProductShelf from 'src/components/sections/ProductShelf'
@@ -155,24 +156,26 @@ export const getStaticProps: GetStaticProps<
 > = async ({ params }) => {
   const id = params?.slug.split('-').pop() ?? ''
 
-  const { data, errors } = await execute<
+  const { data, errors = [] } = await execute<
     ServerProductPageQueryQueryVariables,
     ServerProductPageQueryQuery
   >({
     variables: { id },
     operationName: query,
   })
 
-  if (errors?.length > 0) {
-    throw new Error(`${errors[0]}`)
-  }
+  const notFound = errors.find(isNotFoundError)
 
-  if (data === null) {
+  if (notFound) {
     return {
       notFound: true,
     }
   }
 
+  if (errors.length > 0) {
+    throw errors[0]
+  }
+
   return {
     props: data,
   }

src/pages/api/graphql.ts

@@ -1,3 +1,4 @@
+import { isFastStoreError } from '@faststore/api'
 import type { NextApiHandler, NextApiRequest } from 'next'
 
 import { execute } from '../../server'
@@ -46,8 +47,9 @@ const handler: NextApiHandler = async (request, response) => {
     )
 
     if (Array.isArray(result.errors)) {
-      // TODO: Return 400 on userError
-      response.status(500)
+      const error = result.errors.find(isFastStoreError)
+
+      response.status(error?.extensions.status ?? 500)
     }
 
     response.setHeader('cache-control', 'no-cache, no-store')

src/server/index.ts

@@ -9,7 +9,7 @@ import type { FormatErrorHandler } from '@envelop/core'
 import { useGraphQlJit } from '@envelop/graphql-jit'
 import { useParserCache } from '@envelop/parser-cache'
 import { useValidationCache } from '@envelop/validation-cache'
-import { getContextFactory, getSchema } from '@faststore/api'
+import { getContextFactory, getSchema, isFastStoreError } from '@faststore/api'
 import { GraphQLError } from 'graphql'
 import type { Options as APIOptions } from '@faststore/api'
 
@@ -40,17 +40,13 @@ export const apiSchema = getSchema(apiOptions)
 
 const apiContextFactory = getContextFactory(apiOptions)
 
-const isBadRequestError = (err: GraphQLError) => {
-  return err.originalError && err.originalError.name === 'BadRequestError'
-}
-
 const formatError: FormatErrorHandler = (err) => {
-  console.error(err)
-
-  if (err instanceof GraphQLError && isBadRequestError(err)) {
+  if (err instanceof GraphQLError && isFastStoreError(err.originalError)) {
     return err
   }
 
+  console.error(err)
+
   return new GraphQLError('Sorry, something went wrong.')
 }
 

yarn.lock

@@ -1430,10 +1430,10 @@
     minimatch "^3.0.4"
     strip-json-comments "^3.1.1"
 
-"@faststore/api@^1.9.3":
-  version "1.9.3"
-  resolved "https://registry.yarnpkg.com/@faststore/api/-/api-1.9.3.tgz#26afdade5bdbbd908b6c6d03f8a7f848898bfab1"
-  integrity sha512-1l2/bxxIJL9pOblQsbCH/Lm577eTaRLn1tkZQ+bFTb1+NzrZl58BAKgv5FqCVqzBG7X1GcoVIq+q3G+MsB6dEQ==
+"@faststore/api@^1.9.6":
+  version "1.9.6"
+  resolved "https://registry.yarnpkg.com/@faststore/api/-/api-1.9.6.tgz#c94c32fc2fb2098d6016914475b508e3f9afcf42"
+  integrity sha512-J3zi7g+szhQBLU9jgYgFDwP4oQFJB+4BpFx/Qvtn6voRsScRoP1Sz9Yk/1lZ2t1T5IZFTn4Qw/oudK2ii5+hMA==
   dependencies:
     "@graphql-tools/schema" "^8.2.0"
     "@rollup/plugin-graphql" "^1.0.0"
@@ -1442,17 +1442,17 @@
     isomorphic-unfetch "^3.1.0"
     p-limit "^3.1.0"
 
-"@faststore/sdk@^1.9.2":
-  version "1.9.2"
-  resolved "https://registry.yarnpkg.com/@faststore/sdk/-/sdk-1.9.2.tgz#9e0b302f0d20333af0681be10013996493e94f09"
-  integrity sha512-sOoa9Axex0V3byvcCXkBuJSbfXcVnNrQxiovX4TaIWK2dcIx6+NnTKrQS8aTcaCwxmj1zACCw3lDt4yn06zR2w==
+"@faststore/sdk@^1.9.4":
+  version "1.9.4"
+  resolved "https://registry.yarnpkg.com/@faststore/sdk/-/sdk-1.9.4.tgz#fa041160e6f90d789866ee9176da2ff4336b9d8b"
+  integrity sha512-emdCI738A3IBY0hrsR+Gs63eg2/ZDSllHObdbJnMemodTTY3rEYKA00KvBz7zTkkFydkWYXs3tKO0NfM+kO8WA==
   dependencies:
     idb-keyval "^5.1.3"
 
-"@faststore/ui@^1.9.2":
-  version "1.9.2"
-  resolved "https://registry.yarnpkg.com/@faststore/ui/-/ui-1.9.2.tgz#3ae00b0c72a79892113b46676741bd12fd876f7a"
-  integrity sha512-yDMkDaOgOfRciHj7PiIBQdYwXsbdwmAOMVbO9cgP3brmE+9didi2FFI7spZicSjLnje3SLeaBQ/n3ETaM29TRA==
+"@faststore/ui@^1.9.4":
+  version "1.9.4"
+  resolved "https://registry.yarnpkg.com/@faststore/ui/-/ui-1.9.4.tgz#fb76491f476fc3a1dac0a5dbf7da013a8e9bd69b"
+  integrity sha512-IC8CzxiZU91UDV5FGdMrBD/HiMXS8JLZt0cJ2iCbJWHzpU0p40ja7GGP6DIxKCuauW++T5zeHg5rB4VF3T7/nQ==
   dependencies:
     "@reach/popover" "^0.16.0"
     "@storybook/addon-a11y" "^6.4.4"