🎉 전역적 에러 처리 추가

src/app/(root)/(routes)/chatrooms/[chatRoomId]/page.tsx

@@ -1,6 +1,9 @@
 import React from 'react'
 import PageTitle from '@/components/domain/page-title'
 import ApiEndPoint from '@/config/apiEndPoint'
+import errorCodes from '@/config/errorCodes'
+import ErrorMessages from '@/config/errorMessages'
+import { ForbiddenError } from '@/lib/errors'
 import apiClient from '@/services/apiClient'
 import { getServerCookie } from '@/utils/getServerCookie'
 import ChatRoomTemplate from './components/ChatRoomTemplate'
@@ -26,15 +29,24 @@ const getInitialUser = async () => {
 }
 
 const getInitialChatRoom = async (chatRoomId: string) => {
-  const token = getServerCookie()
-  const res = await apiClient.get(
-    ApiEndPoint.getChatRoom(chatRoomId),
-    {},
-    {
-      Authorization: `${token}`,
-    },
-  )
-  return res.data.chatRoomInfo
+  try {
+    const token = getServerCookie()
+    const res = await apiClient.get(
+      ApiEndPoint.getChatRoom(chatRoomId),
+      {},
+      {
+        Authorization: `${token}`,
+      },
+    )
+    return res.data.chatRoomInfo
+  } catch (e: any) {
+    const log = await e.response.json()
+    if (log.code === errorCodes.forbidden.code) {
+      throw new ForbiddenError(new Response(ErrorMessages.Forbidden))
+    }
+
+    throw new Error(e)
+  }
 }
 
 const getCompleteRequestInfo = async (completeRequestId: number) => {
@@ -74,7 +86,7 @@ const ChatPage = async ({ params }: ChatPageProps) => {
 
   return (
     <main className="relative flex flex-col items-center w-full gap-10 h-page pb-chat_input">
-      <header className="w-full flex flex-row items-center px-4">
+      <header className="flex flex-row items-center w-full px-4">
         <PageTitle title="채팅방" />
         {!isCompleteRequested && (
           <CompleteRequestButton

src/app/(root)/(routes)/suggestions/[myCardId]/page.tsx

@@ -1,17 +1,32 @@
 import MaxWidthWrapper from '@/components/domain/max-width-wrapper'
 import PageTitle from '@/components/domain/page-title'
+import ApiEndPoint from '@/config/apiEndPoint'
+import ErrorMessages from '@/config/errorMessages'
+import { ForbiddenError } from '@/lib/errors'
+import apiClient from '@/services/apiClient'
 import { getCardInfo } from '@/services/card/card'
 import { CardDetail } from '@/types/card'
+import { getServerCookie } from '@/utils/getServerCookie'
 import MyCardDescriptionSection from './components/my-card-description-section'
 import MySuggestionListContent from './components/my-suggestion-list-content'
 
 async function getMyCardInfo(cardId: string) {
-  try {
-    const res = await getCardInfo(Number(cardId))
-    return res.data.cardInfo
-  } catch (e) {
-    console.log(e)
+  const token = getServerCookie()
+
+  const resCard = await getCardInfo(Number(cardId))
+  const resUser = await apiClient.get(
+    ApiEndPoint.getValidateUser(),
+    {},
+    {
+      Authorization: `${token}`,
+    },
+  )
+
+  if (resUser.data.userInfo.userId !== resCard.data.userInfo.userId) {
+    throw new ForbiddenError(new Response(ErrorMessages.Forbidden))
   }
+
+  return resCard.data.cardInfo
 }
 
 const SuggestCheckListPage = async ({

src/app/error.tsx

@@ -0,0 +1,15 @@
+'use client'
+
+import ErrorGateway from '@/components/domain/errors/ErrorGateway'
+
+type ErrorPageProps = {
+  error: Error & { digest?: string }
+  reset: () => void
+}
+
+export default function GlobalError({
+  error,
+  reset,
+}: Readonly<ErrorPageProps>) {
+  return <ErrorGateway error={error} reset={reset} />
+}