Query Parameters в API

/api/products?category=books

app/api/products/route.ts

export async function GET(request: Request) {
  const url = new URL(request.url);
  const searchParams = url.searchParams;

  const search = searchParams.get("search");

  return Response.json({
    search,
  });
}

/api/products?search=javascript

const search = searchParams.get("search")?.trim() ?? "";

/api/products?category=books&category=games

const categories = searchParams.getAll("category");

["books", "games"]

const rawPage = searchParams.get("page");
const page = rawPage === null ? 1 : Number(rawPage);

if (!Number.isInteger(page) || page < 1) {
  return Response.json(
    { error: "Параметр page має бути додатним цілим числом" },
    { status: 400 },
  );
}

app/api/products/route.ts

type Category = "books" | "games" | "electronics";

type Product = {
  id: number;
  name: string;
  category: Category;
};

const products: Product[] = [
  { id: 1, name: "JavaScript для початківців", category: "books" },
  { id: 2, name: "TypeScript Handbook", category: "books" },
  { id: 3, name: "The Legend of Zelda", category: "games" },
  { id: 4, name: "Ігрова клавіатура", category: "electronics" },
  { id: 5, name: "React Patterns", category: "books" },
  { id: 6, name: "Minecraft", category: "games" },
  { id: 7, name: "Бездротова миша", category: "electronics" },
  { id: 8, name: "Next.js у практиці", category: "books" },
];

const allowedCategories = new Set<Category>([
  "books",
  "games",
  "electronics",
]);

function parsePositiveInteger(
  value: string | null,
  defaultValue: number,
): number | null {
  if (value === null || value.trim() === "") {
    return defaultValue;
  }

  const number = Number(value);

  if (!Number.isInteger(number) || number < 1) {
    return null;
  }

  return number;
}

export async function GET(request: Request) {
  const url = new URL(request.url);
  const searchParams = url.searchParams;

  const rawCategory = searchParams.get("category");
  const search = searchParams.get("search")?.trim().toLowerCase() ?? "";

  const page = parsePositiveInteger(searchParams.get("page"), 1);
  const requestedPageSize = parsePositiveInteger(
    searchParams.get("pageSize"),
    10,
  );

  if (page === null) {
    return Response.json(
      { error: "Параметр page має бути додатним цілим числом" },
      { status: 400 },
    );
  }

  if (requestedPageSize === null) {
    return Response.json(
      { error: "Параметр pageSize має бути додатним цілим числом" },
      { status: 400 },
    );
  }

  const pageSize = Math.min(requestedPageSize, 50);

  if (
    rawCategory !== null &&
    !allowedCategories.has(rawCategory as Category)
  ) {
    return Response.json(
      {
        error: "Невідома категорія",
        allowedCategories: [...allowedCategories],
      },
      { status: 400 },
    );
  }

  const category = rawCategory as Category | null;

  const filteredProducts = products.filter((product) => {
    const matchesCategory =
      category === null || product.category === category;

    const matchesSearch =
      search === "" || product.name.toLowerCase().includes(search);

    return matchesCategory && matchesSearch;
  });

  const total = filteredProducts.length;
  const totalPages = Math.ceil(total / pageSize);
  const startIndex = (page - 1) * pageSize;
  const items = filteredProducts.slice(startIndex, startIndex + pageSize);

  return Response.json({
    items,
    pagination: {
      page,
      pageSize,
      total,
      totalPages,
    },
  });
}

/api/products?category=books&search=javascript&page=1&pageSize=5

{
  "items": [
    {
      "id": 1,
      "name": "JavaScript для початківців",
      "category": "books"
    }
  ],
  "pagination": {
    "page": 1,
    "pageSize": 5,
    "total": 1,
    "totalPages": 1
  }
}

const matchesCategory =
  category === null || product.category === category;

const matchesSearch =
  search === "" || product.name.toLowerCase().includes(search);

const startIndex = (page - 1) * pageSize;
const items = filteredProducts.slice(startIndex, startIndex + pageSize);

startIndex = (1 - 1) * 10 = 0

startIndex = (2 - 1) * 10 = 10

{
  "pagination": {
    "page": 2,
    "pageSize": 10,
    "total": 35,
    "totalPages": 4
  }
}

{
  "error": "Параметр page має бути додатним цілим числом"
}

{
  "items": [],
  "pagination": {
    "page": 1,
    "pageSize": 10,
    "total": 0,
    "totalPages": 0
  }
}

const page = Number(searchParams.get("page"));

/api/products
/api/products?search=

const pageSize = Math.min(requestedPageSize, 50);

const allowedCategories = new Set(["books", "games", "electronics"]);

if (category !== null && !allowedCategories.has(category)) {
  // повернення помилки 400
}