refactor(api): implement types for api request

Author: yoshinorin

__tests__/unit/api/api.test.ts

@@ -1,4 +1,6 @@
-import { expect, test } from "vitest";
+import { describe, expect, it, test } from "vitest";
+import { PaginationParams } from "../../../src/api";
+import { Order, getValidOrder } from "../../../src/api/order";
 import { RequestOptions, fetchFromApi } from "../../../src/api/request";
 
 test("should returns 404 if path contains ignore chars", async () => {
@@ -8,3 +10,60 @@ test("should returns 404 if path contains ignore chars", async () => {
   const response = await fetchFromApi("https://example.com/hoge.svg", options);
   expect(response.status).toEqual(404);
 });
+
+
+describe("PaginationParams", () => {
+  it("should accept valid PaginationParams object", () => {
+    const params: PaginationParams = {
+      page: 1,
+      limit: 10,
+      order: Order.DESC,
+    };
+
+    expect(params.page).toBe(1);
+    expect(params.limit).toBe(10);
+    expect(params.order).toBe(Order.DESC);
+  });
+
+  it("should work with different Order values", () => {
+    const defaultParams: PaginationParams = {
+      page: 1,
+      limit: 20,
+      order: Order.DEFAULT,
+    };
+
+    const randomParams: PaginationParams = {
+      page: 2,
+      limit: 5,
+      order: Order.RANDOM,
+    };
+
+    expect(defaultParams.order).toBe(Order.DEFAULT);
+    expect(randomParams.order).toBe(Order.RANDOM);
+  });
+
+  it("should enforce correct types", () => {
+    const params: PaginationParams = {
+      page: 1,
+      limit: 10,
+      order: Order.DESC,
+    };
+
+    expect(typeof params.page).toBe("number");
+    expect(typeof params.limit).toBe("number");
+    expect(typeof params.order).toBe("string");
+  });
+
+  it("should work with getValidOrder function", () => {
+    const orderParam = "desc";
+    const validOrder = getValidOrder(orderParam);
+
+    const params: PaginationParams = {
+      page: 1,
+      limit: 10,
+      order: validOrder,
+    };
+
+    expect(params.order).toBe(Order.DESC);
+  });
+});

__tests__/unit/api/order.test.ts

@@ -0,0 +1,53 @@
+import { describe, expect, it } from "vitest";
+import { Order, getValidOrder } from "../../../src/api/order";
+
+describe("Order", () => {
+  it("should have correct enum values", () => {
+    expect(Order.DEFAULT).toBe("default");
+    expect(Order.DESC).toBe("desc");
+    expect(Order.RANDOM).toBe("random");
+  });
+});
+
+describe("getValidOrder", () => {
+  it("should return Order.DESC when given 'desc'", () => {
+    const result = getValidOrder("desc");
+    expect(result).toBe(Order.DESC);
+  });
+
+  it("should return Order.RANDOM when given 'random'", () => {
+    const result = getValidOrder("random");
+    expect(result).toBe(Order.RANDOM);
+  });
+
+  it("should return Order.DEFAULT when given 'default'", () => {
+    const result = getValidOrder("default");
+    expect(result).toBe(Order.DEFAULT);
+  });
+
+  it("should return Order.DEFAULT when given undefined", () => {
+    const result = getValidOrder(undefined);
+    expect(result).toBe(Order.DEFAULT);
+  });
+
+  it("should return Order.DEFAULT when given invalid string", () => {
+    const result = getValidOrder("invalid");
+    expect(result).toBe(Order.DEFAULT);
+  });
+
+  it("should return Order.DEFAULT when given empty string", () => {
+    const result = getValidOrder("");
+    expect(result).toBe(Order.DEFAULT);
+  });
+
+  it("should return Order.DEFAULT when given null", () => {
+    const result = getValidOrder(null as any);
+    expect(result).toBe(Order.DEFAULT);
+  });
+
+  it("should be case sensitive", () => {
+    expect(getValidOrder("DESC")).toBe(Order.DEFAULT);
+    expect(getValidOrder("Desc")).toBe(Order.DEFAULT);
+    expect(getValidOrder("RANDOM")).toBe(Order.DEFAULT);
+  });
+});

src/api/index.ts

@@ -1,20 +1,27 @@
 import { api, publicApi } from "../../config";
 import { requestContextFrom } from "../utils/requestContext";
 import { buildQueryParams, buildUrl, sluggize } from "../utils/url";
+import { Order } from "./order";
 import { RequestOptions, fetchFromApi, requestHeaderFrom } from "./request";
 
+export interface PaginationParams {
+  page: number;
+  limit: number;
+  order: Order;
+}
+
 export function fetchArticles(
   headers: Headers,
   currentPage: number,
   limit: number,
-  order: string
+  order: Order
 ): Promise<Response> {
   const url = buildUrl(api.url, "v1/articles", true);
   const ctx = requestContextFrom(headers);
   const options: RequestOptions = {
     headers: requestHeaderFrom(ctx),
     queryParams: buildQueryParams({
-      pagination: { page: currentPage, limit: limit, order: order }
+      pagination: { page: currentPage, limit, order } as PaginationParams
     })
   };
   return fetchFromApi(url, options);
@@ -120,7 +127,7 @@ export function fetchTag(
   tagName: string,
   currentPage: number,
   limit: number,
-  order: string
+  order: Order
 ): Promise<Response> {
   const url = buildUrl(
     api.url,
@@ -131,7 +138,7 @@ export function fetchTag(
   const options: RequestOptions = {
     headers: requestHeaderFrom(ctx),
     queryParams: buildQueryParams({
-      pagination: { page: currentPage, limit: limit, order: order }
+      pagination: { page: currentPage, limit, order } as PaginationParams
     })
   };
   return fetchFromApi(url, options);

src/api/order.ts

@@ -0,0 +1,16 @@
+export enum Order {
+  DEFAULT = 'default',
+  DESC = 'desc',
+  RANDOM = 'random'
+}
+
+export function getValidOrder(orderParam: string | undefined): Order {
+  switch (orderParam) {
+    case Order.DESC:
+      return Order.DESC;
+    case Order.RANDOM:
+      return Order.RANDOM;
+    default:
+      return Order.DEFAULT;
+  }
+}

src/app/articles/page.tsx

@@ -2,6 +2,7 @@
 
 import { headers } from "next/headers";
 import { fetchArticles } from "../../api";
+import { getValidOrder, Order } from "../../api/order";
 import { Article, ArticleResponseWithCount } from "../../models/models";
 import { parseOrThrow, runWithHandleErrorIf } from "../handler";
 import { Renderer } from "./renderer";
@@ -16,8 +17,8 @@ export default async function Page(req: any) {
 
 async function handler(req: any) {
   const queryString = await req.searchParams;
-  const order = queryString.order;
-  const randomness = order === "random";
+  const order = getValidOrder(queryString.order);
+  const randomness = order === Order.RANDOM;
   const currentPage = queryString.p ? queryString.p : 1;
   const response: Response = await fetchArticles(
     await headers(),

src/app/page.tsx

@@ -2,6 +2,7 @@
 
 import { headers } from "next/headers";
 import { fetchArticles } from "../api";
+import { Order } from "../api/order";
 import { Article, ArticleResponseWithCount } from "../models/models";
 import { parseOrThrow, runWithHandleErrorIf } from "./handler";
 import { Renderer } from "./renderer";
@@ -15,7 +16,7 @@ export default async function Page(req: any) {
 }
 
 async function handler(req: any) {
-  const response: Response = await fetchArticles(await headers(), 1, 5);
+  const response: Response = await fetchArticles(await headers(), 1, 5, Order.DEFAULT);
   const articlesResponseWithCount =
     await parseOrThrow<ArticleResponseWithCount>(response);
   const articles: Array<Article> = articlesResponseWithCount.articles.map(

src/app/tags/[...slug]/page.tsx

@@ -2,6 +2,7 @@
 
 import { headers } from "next/headers";
 import { fetchTag } from "../../../api";
+import { getValidOrder, Order } from "../../../api/order";
 import { Article, ArticleResponseWithCount } from "../../../models/models";
 import { parseOrThrow, runWithHandleErrorIf } from "../../handler";
 import { Renderer } from "./renderer";
@@ -19,8 +20,8 @@ async function handler(req: any) {
   const tagName = decodeURI(slug[0]);
 
   const queryString = await req.searchParams;
-  const order = queryString.order;
-  const randomness = order === "random";
+  const order = getValidOrder(queryString.order);
+  const randomness = order === Order.RANDOM;
   const currentPage = queryString.p ? queryString.p : 1;
   const response: Response = await fetchTag(
     await headers(),