JSON 응답에 적절한 타입 주기

작성‌

수정‌

// response.ts

type FailResponse<T> = {
	ok: false;
	error: string;
} & T;

type SuccessResponse<T> = {
	ok: true;
} & T;

export type DefaultResponse<T = {}, U = {}> =
	| SuccessResponse<T>
	| FailResponse<U>;

// route.ts (Next.js)

export type NewStatusResponse = DefaultResponse<
	{
  	id: string;
  },
	{
		supportedServers?: string[];
		clientServer?: string;
	}
>;

// ...

return NextResponse.json<NewStatusesResponse>(
	{ ok: false, error: "Not logged in" },
	{ status: 401 }
);

// OR

return NextResponse.json<NewStatusResponse>(
	{
		ok: false,
		error: "BETA_LIMITED_SERVER_ERROR",
		supportedServers,
		clientServer,
	},
	{ status: 403 }
);

// OR

return NextResponse.json<NewStatusResponse>({ ok: true, id: status.id });

// page.tsx (Next.js)

const [submit, { data, isLoading }] = useMutation<
	NewStatusResponse, // 이게 data의 타입으로 들어가도록 useMutation 정의에서 제너릭을 사용했어요
	NewStatusRequest
>("/api/post", "POST");

useEffect(() => {
	if (data && data.ok) {
		mutate("/api/post");
		router.replace(`/post/${data.id}`);

		return;
	}

	if (data && !data.ok && data.error === "BETA_LIMITED_SERVER_ERROR") {
		setShowBetaError(true);

		return;
	}
}, [data, router]);