Fix:리스트 디자인 수정

src/components/MyPlans/Cards/PlanCard.tsx

@@ -23,7 +23,7 @@ export default function PlanCard({ planDetail }: PlanData) {
           <label className="w-[150px] text-color-gray-300" htmlFor="tripType">
             여행 유형
           </label>
-          <div className="text-color-black-400">
+          <div className="text-nowrap text-color-black-400">
             <Label labelType={planDetail?.tripType || "-"} customLabelContainerClass="rounded-lg" />
           </div>
         </div>

src/components/MyPlans/MyPlanList.tsx

@@ -55,8 +55,8 @@ const MyPlanList = forwardRef<HTMLDivElement, MyPlanListProps>(
 
     return (
       <div className="my-12 flex flex-col rounded-2xl border-color-gray-300 bg-color-gray-50 shadow">
-        <div className="semibold px-8 pt-8 text-2xl">{`${title} 플랜 목록`}</div>
-        <div className="flex-col p-8">
+        <div className="semibold px-8 pt-8 text-2xl mobile-tablet:px-4 mobile-tablet:pt-4 mobile-tablet:text-xl">{`${title} 플랜 목록`}</div>
+        <div className="flex-col p-8 mobile-tablet:p-4">
           {isLoading ? (
             <div className="flex h-screen items-center justify-center">
               <Image src={loading} alt="로딩 중" />
@@ -66,24 +66,28 @@ const MyPlanList = forwardRef<HTMLDivElement, MyPlanListProps>(
               {visiblePlans.map((plan) => (
                 <div
                   key={plan.id}
-                  className="mb-3 flex justify-between rounded-2xl border-color-gray-300 bg-color-gray-50 p-2 shadow"
+                  className="mb-3 flex justify-between rounded-2xl border-color-gray-300 bg-color-gray-50 p-2 shadow mobile-tablet:flex-col"
                 >
                   <div>
                     <div className="semibold flex gap-2 px-2 pt-2 text-2lg">{plan.title}</div>
-                    <div className="regular flex px-2 pt-2 text-lg">
-                      {convertRegionToKorean(plan.serviceArea)}
-                      <p className="text-color-line-200">ㅣ</p>
-                      {formatToSimpleDate(plan.tripDate)}
-                      <p className="text-color-line-200">ㅣ</p>
-                      <Label
-                        labelType={plan.tripType}
-                        labelSize="sm"
-                        customLabelContainerClass="rounded-lg"
-                      />
+                    <div className="regular flex text-nowrap px-2 pt-2 text-lg mobile-tablet:flex-col mobile-tablet:text-md">
+                      <div className="flex mobile-tablet:mb-2">
+                        <p>{convertRegionToKorean(plan.serviceArea)}</p>
+                        <p className="text-color-line-200">ㅣ</p>
+                        <p>{formatToSimpleDate(plan.tripDate)}</p>
+                      </div>
+                      <p className="text-color-line-200 mobile-tablet:hidden">ㅣ</p>
+                      <div className="inline-block max-w-max text-nowrap mobile-tablet:mb-2">
+                        <Label
+                          labelType={plan.tripType}
+                          labelSize="sm"
+                          customLabelContainerClass="rounded-lg"
+                        />
+                      </div>
                     </div>
                   </div>
                   <button
-                    className="min-w-38 semibold text-nowrap rounded-lg border-[1px] border-solid border-color-blue-300 bg-color-gray-50 px-[32.5px] py-4 text-xl text-color-blue-300 mobile:text-md tablet:text-lg mobile-tablet:px-[16px] mobile-tablet:py-[6px]"
+                    className="semibold text-nowrap rounded-lg border-[1px] border-solid border-color-blue-300 bg-color-gray-50 px-5 py-4 text-lg text-color-blue-300 mobile-tablet:mt-1 mobile-tablet:px-4 mobile-tablet:py-1 mobile-tablet:text-md"
                     onClick={() => handleDetailClick(plan.id)}
                   >
                     플랜 상세

src/components/MyPlans/QuotationCardList.tsx

@@ -32,10 +32,18 @@ export default function QuotationCardList({ planDetail }: PlanData) {
   if (!quotations?.list || quotations.list.length === 0) {
     return (
       <div className="flex flex-col items-center justify-center text-center text-xl text-color-gray-500">
-        <p>아직 받은 견적이 없어요!</p>
-        <br />
-        <p>지정견적요청을 해보세요!</p>
-        <Link href="" className="text-blue-500 underline"></Link>
+        <div className="w-full rounded-2xl bg-color-gray-50 p-8 shadow">
+          <p>아직 받은 견적이 없어요!</p>
+          <br />
+          <p>지정견적요청을 해보세요!</p>
+          <br />
+          <button className="border-1 rounded-lg bg-color-blue-200 p-2">
+            <Link href="/finding-maker" className="text-gray-100">
+              {" "}
+              Maker 찾기
+            </Link>
+          </button>
+        </div>
       </div>
     );
   }

src/components/MyReviews/Cards/ReviewCard.tsx

@@ -59,7 +59,7 @@ export default function ReviewCard({ reviewDetail }: ReviewCardProps) {
       </div>
       <div>
         <p className="regular text-right text-md text-color-gray-300 pc:hidden">
-          작성일 {reviewDetail.createdAt}
+          작성일 {formatToSimpleDate(reviewDetail.createdAt)}
         </p>
       </div>
     </div>

src/pages/myreview-manage/completed-trip/index.tsx

@@ -72,4 +72,4 @@ export function CompletedTrip() {
   );
 }
 
-export default withAuthAccess(CompletedTrip);
+export default withAuthAccess(CompletedTrip, "DREAMER");

src/pages/myreview-manage/reviewable-trip/index.tsx

@@ -76,4 +76,4 @@ export function ReviewableTrip() {
   );
 }
 
-export default withAuthAccess(ReviewableTrip);
+export default withAuthAccess(ReviewableTrip, "DREAMER");

src/pages/myreview-manage/reviewed-trip/index.tsx

@@ -76,4 +76,4 @@ export function ReviewedTrip() {
   );
 }
 
-export default withAuthAccess(ReviewedTrip);
+export default withAuthAccess(ReviewedTrip, "DREAMER");

src/pages/mytrip-manage/completed-plan/detail/[id].tsx

@@ -31,4 +31,4 @@ export function CompletedPlanDetail() {
   );
 }
 
-export default withAuthAccess(CompletedPlanDetail);
+export default withAuthAccess(CompletedPlanDetail, "DREAMER");

src/pages/mytrip-manage/completed-plan/index.tsx

@@ -47,7 +47,7 @@ export function CompletedPlan() {
       <MyPlanNav />
       <Layout bodyClass="bg-gray">
         <MyPlanList
-          title="종료된"
+          title="🛬 종료된"
           status="completed"
           visiblePlans={planData}
           fetchNextPage={fetchNextPage}
@@ -60,4 +60,4 @@ export function CompletedPlan() {
   );
 }
 
-export default withAuthAccess(CompletedPlan);
+export default withAuthAccess(CompletedPlan, "DREAMER");

src/pages/mytrip-manage/ongoing-plan/detail/[id].tsx

@@ -31,4 +31,4 @@ export function OngoingPlanDetail() {
   );
 }
 
-export default withAuthAccess(OngoingPlanDetail);
+export default withAuthAccess(OngoingPlanDetail, "DREAMER");

src/pages/mytrip-manage/ongoing-plan/index.tsx

@@ -49,7 +49,7 @@ export function OngoingPlan() {
       <MyPlanNav />
       <Layout bodyClass="bg-gray">
         <MyPlanList
-          title="진행 중인"
+          title="🛫 진행 중인"
           status="ongoing"
           visiblePlans={planData}
           fetchNextPage={fetchNextPage}
@@ -69,4 +69,4 @@ export function OngoingPlan() {
   );
 }
 
-export default withAuthAccess(OngoingPlan);
+export default withAuthAccess(OngoingPlan, "DREAMER");

src/pages/mytrip-manage/overdue-plan/detail/[id].tsx

@@ -31,4 +31,4 @@ export function OverduePlanDetail() {
   );
 }
 
-export default withAuthAccess(OverduePlanDetail);
+export default withAuthAccess(OverduePlanDetail, "DREAMER");

src/pages/mytrip-manage/overdue-plan/index.tsx

@@ -47,7 +47,7 @@ export function OverduePlan() {
       <MyPlanNav />
       <Layout bodyClass="bg-gray">
         <MyPlanList
-          title="만료된"
+          title="🕑 만료된"
           status="overdue"
           visiblePlans={planData}
           fetchNextPage={fetchNextPage}
@@ -60,4 +60,4 @@ export function OverduePlan() {
   );
 }
 
-export default withAuthAccess(OverduePlan);
+export default withAuthAccess(OverduePlan, "DREAMER");

src/pages/mytrip-manage/quotationdetail-dreamer/[planId]/[quotationId].tsx

@@ -329,4 +329,4 @@ export function QuotationDetailDreamer() {
   );
 }
 
-export default withAuthAccess(QuotationDetailDreamer);
+export default withAuthAccess(QuotationDetailDreamer, "DREAMER");

src/services/planService.ts

@@ -82,6 +82,7 @@ const planService = {
 
       params.push(`page=${page}`);
       params.push(`pageSize=${pageSize}`);
+      params.push(`orderBy=RECENT`);
 
       queryString = params.length > 0 ? `?${params.join("&")}` : "";
 
@@ -103,7 +104,11 @@ const planService = {
     try {
       const response = await api.get<Plan, {}>(`/plans/${planId}`);
       return response;
-    } catch (error) {
+    } catch (error: any) {
+      if (error.response && error.response.status === 404) {
+        window.location.href = "/404";
+        return Promise.reject(new Error("해당 여행 플랜을 찾을 수 없습니다."));
+      }
       console.error("여행 데이터 요청 실패", error);
       throw error;
     }

test.http

@@ -89,7 +89,7 @@ Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySWQiOiI2Njg4N
 
 ### 완료 가능 플랜 불러오기(dreamer)
 GET https://www.goforme.duckdns.org/plans/dreamer?readyToComplete=true&page=1&pageSize=6
-Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySWQiOiI2Njg4NWEzYy01MGY0LTQyN2ItOGE5Mi0zNzAyYzY5NzZmYjAiLCJyb2xlIjoiRFJFQU1FUiIsImlhdCI6MTczOTgwMDQxNSwiZXhwIjoxNzM5ODg2ODE1fQ.VKDq_T-dg2NK6xRC_2GeSNLXBLGD2SyIzbaAXWmfrfc
+Authorization: Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySWQiOiI2Njg4NWEzYy01MGY0LTQyN2ItOGE5Mi0zNzAyYzY5NzZmYjAiLCJyb2xlIjoiRFJFQU1FUiIsImlhdCI6MTczOTk1NDMxNSwiZXhwIjoxNzQwMDQwNzE1fQ.OBkKC2CqmSdntE_hmVbmEWkeF2_mgmtP7GNKemv95Do
 
 
 ### 리뷰가능한 플랜 목록 조회(dreamer)