@sanity/remix-http-errors

Sort of like http-errors except they're not errors, they're responses designed to work in remix loaders with v7_singleFetch enabled. But you can throw them if you want.

Examples

Simple example of returning a 400 response:

``ts import {BadRequest} from '@sanity/remix-http-errors'

export const loader: LoaderFunction = async ({request}) => { const url = new URL(request.url)

const queryParam = url.searchParams.get('_q')

if (!queryParam) { return BadRequest('You must provide a query parameter') }

const data = await getData(queryParam)

return {data} }`

Or, if you prefer to use something like zod:

`ts import {BadRequest} from '@sanity/remix-http-errors' import {z} from 'zod'

export const loader: LoaderFunction = async ({request}) => { const url = new URL(request.url)

const queryParam = queryParamSchema.parse(url.searchParams.get('_q')).catch((err) => { if (err instanceof z.ZodError) { throw BadRequest('You must provide a query parameter', { cause: err, }) } })

const data = await getData(queryParam)

return {data} }``

List of all errors

| Status Code | Constructor Name |
| ----------- | ----------------------------- |
| 400 | BadRequest |
| 401 | Unauthorized |
| 402 | PaymentRequired |
| 403 | Forbidden |
| 404 | NotFound |
| 405 | MethodNotAllowed |
| 406 | NotAcceptable |
| 407 | ProxyAuthenticationRequired |
| 408 | RequestTimeout |
| 409 | Conflict |
| 410 | Gone |
| 411 | LengthRequired |
| 412 | PreconditionFailed |
| 413 | PayloadTooLarge |
| 414 | URITooLong |
| 415 | UnsupportedMediaType |
| 416 | RangeNotSatisfiable |
| 417 | ExpectationFailed |
| 418 | ImATeapot |
| 421 | MisdirectedRequest |
| 422 | UnprocessableEntity |
| 423 | Locked |
| 424 | FailedDependency |
| 425 | TooEarly |
| 426 | UpgradeRequired |
| 428 | PreconditionRequired |
| 429 | TooManyRequests |
| 431 | RequestHeaderFieldsTooLarge |
| 451 | UnavailableForLegalReasons |
| 500 | InternalServerError |
| 501 | NotImplemented |
| 502 | BadGateway |
| 503 | ServiceUnavailable |
| 504 | GatewayTimeout |
| 505 | HTTPVersionNotSupported |
| 506 | VariantAlsoNegotiates |
| 507 | InsufficientStorage |
| 508 | LoopDetected |
| 509 | BandwidthLimitExceeded |
| 510 | NotExtended |
| 511 | NetworkAuthenticationRequired |

Examples

Simple example of returning a 400 response:

ts
import {BadRequest} from '@sanity/remix-http-errors'

export const loader: LoaderFunction = async ({request}) => {
  const url = new URL(request.url)

const queryParam = url.searchParams.get('_q')

  if (!queryParam) {
    return BadRequest('You must provide a query parameter')
  }

const data = await getData(queryParam)

  return {data}
}

Or, if you prefer to use something like zod:

ts
import {BadRequest} from '@sanity/remix-http-errors'
import {z} from 'zod'

export const loader: LoaderFunction = async ({request}) => {
  const url = new URL(request.url)

  const queryParam = queryParamSchema.parse(url.searchParams.get('_q')).catch((err) => {
    if (err instanceof z.ZodError) {
      throw BadRequest('You must provide a query parameter', {
        cause: err,
      })
    }
  })

const data = await getData(queryParam)

  return {data}
}

List of all errors