Guide - Validation

Validation in Hyper Fetch is based on mappers. When one of the mappers throws an error, then we catch it and return it as a request error. In this way, we can validate requests and interrupt their processing (i.e. not send them) or responses when we receive data from the server.

Response validation

We can check if the data received from the query is correct and return an error if the validation fails.

import { z } from "zod";

const User = z.object({
  name: z.string(),
  age: z.number(),
});

export const getUser = client
  .createRequest<UserModel>()({
    method: "GET",
    endpoint: "/users/:userId",
  })
  .setResponseMapper(async (response) => {
    User.parse(response); // Throw return request error

    return response;
  });

// Usage

const { error } = await getUser.send({ params: { userId: 1 } });

console.log(error); // ZodError

---

Request validation

We can set global validators that will check the correctness of the data sent and return an error in case of a problem. If there is a problem, the request will not be sent and our request will not be executed. This allows us to easily implement data validation in the entire project without copying validation locally.

import { z } from "zod";

const User = z.object({
  name: z.string(),
  age: z.number(),
});

export const postUser = client
  .createRequest<UserModel, UserData>()({
    method: "POST",
    endpoint: "/users/:userId",
  })
  .setRequestMapper(async (request) => {
    User.parse(request.data); // Throw error

    return response;
  });

// Usage
const { error } = await getUser.send({ params: { userId: 1 }, data: {} });

console.log(error); // ZodError