Refactor/[마이프로필] - 데이터 최신순 정렬,로딩 중복처리 제거 [수정모달]-버튼활성화 조건 수정 [Gnb]-마이프로필에서 리다이렉트 안되게 [에러바운더리]-Back 제거 홈으로 이동하게 수정

src/components/Modal/ReviewModal/EditReviewModal.tsx

@@ -180,11 +180,30 @@ const EditReviewModal = ({
     }
   };
 
+  //watch() 값들 추적
   const content = watch('content');
-  const aromaList = watch('aroma');
+  const aromaList = watch('aroma'); // 한글임
   const rating = watch('rating');
+  const lightBold = watch('lightBold');
+  const smoothTannic = watch('smoothTannic');
+  const drySweet = watch('drySweet');
+  const softAcidic = watch('softAcidic');
 
-  const isFormValid = rating > 0 && content.trim().length > 0 && aromaList.length > 0;
+  // 한글 → 영어 변환
+  const selectedAromaEng = (aromaList || []).map((kor) => aromaMap[kor]).filter(Boolean);
+
+  // 변경 여부 비교
+  const isChanged =
+    rating !== reviewData.rating ||
+    lightBold !== reviewData.lightBold ||
+    smoothTannic !== reviewData.smoothTannic ||
+    drySweet !== reviewData.drySweet ||
+    softAcidic !== reviewData.softAcidic ||
+    content !== reviewData.content ||
+    JSON.stringify(selectedAromaEng) !== JSON.stringify(reviewData.aroma);
+
+  //버튼 활성화 조건 개선
+  const isFormValid = rating > 0 && content.trim().length > 0 && aromaList.length > 0 && isChanged;
 
   const renderButton = (
     <Button

src/components/Modal/WineModal/EditWineModal.tsx

@@ -180,12 +180,19 @@ const EditWineModal = ({ wine, showEditModal, setShowEditModal }: EditWineModalP
   const watchedType = watch('wineType');
   const watchedImage = watch('wineImage');
 
+  const isChanged =
+    watchedName !== wine.name ||
+    watchedPrice !== wine.price.toLocaleString() ||
+    watchedOrigin !== wine.region ||
+    watchedType !== wine.type ||
+    watchedImage?.[0] !== undefined; // 이미지 새로 업로드되면 변경됨
+
   const isFormValid =
     watchedName?.trim() &&
     watchedPrice &&
     watchedOrigin?.trim() &&
     watchedType?.trim() &&
-    watchedImage?.length > 0;
+    isChanged; // 최소 하나라도 바뀐 경우에만 버튼 활성화
 
   const renderButton = (
     <Button

src/components/common/ErrorBoundary.tsx

@@ -98,7 +98,7 @@ class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
           onOpenChange={() => {}}
           onConfirm={() => {
             this.setState({ isOpen: false, hasError: false });
-            router.back();
+            router.replace('/');
           }}
         >
           <div className='text-center custom-text-lg-bold'>{errorMessageToDisplay}</div>

src/components/common/Gnb.tsx

@@ -85,7 +85,9 @@ function UserDropdown({ userImage }: Props) {
     //쿠키 만료시키기
     await apiClient.get(`${process.env.NEXT_PUBLIC_API_URL}/api/auth/logout`);
     clearUser();
-    router.push('/');
+    if (router.pathname !== '/my-profile') {
+      router.push('/');
+    }
   }
 
   return (

src/components/my-profile/ReviewList.tsx

@@ -4,6 +4,7 @@ import { useInfiniteQuery } from '@tanstack/react-query';
 
 import { getMyReviews } from '@/api/myReviews';
 import DotIcon from '@/assets/icons/dot.svg';
+import StarIcon from '@/assets/icons/star.svg';
 import { MyCard } from '@/components/common/card/MyCard';
 import MenuDropdown from '@/components/common/dropdown/MenuDropdown';
 import DeleteModal from '@/components/Modal/DeleteModal/DeleteModal';
@@ -32,12 +33,14 @@ export function ReviewList({ setTotalCount }: ReviewListProps) {
   const observerRef = useRef<HTMLDivElement | null>(null);
 
   // useInfiniteQuery 훅으로 리뷰 데이터를 무한 스크롤 형태로 조회
-  const { data, isError, fetchNextPage, hasNextPage, isFetchingNextPage } = useInfiniteQuery({
-    queryKey: ['reviews'],
-    queryFn: ({ pageParam = 0 }) => getMyReviews({ cursor: pageParam, limit: PAGE_LIMIT }),
-    initialPageParam: 0,
-    getNextPageParam: (lastPage) => lastPage.nextCursor ?? null,
-  });
+  const { data, isError, error, fetchNextPage, hasNextPage, isFetchingNextPage } = useInfiniteQuery(
+    {
+      queryKey: ['reviews'],
+      queryFn: ({ pageParam = 0 }) => getMyReviews({ cursor: pageParam, limit: PAGE_LIMIT }),
+      initialPageParam: 0,
+      getNextPageParam: (lastPage) => lastPage.nextCursor ?? null,
+    },
+  );
   // xhx
   useEffect(() => {
     if (data?.pages?.[0]?.totalCount != null) {
@@ -53,11 +56,13 @@ export function ReviewList({ setTotalCount }: ReviewListProps) {
     isFetching: isFetchingNextPage,
   });
 
-  // 로딩 및 에러 상태 처리 (임시)
-  if (isError) return <p>불러오기 실패</p>;
+  if (isError) throw error;
 
   // 리뷰 목록 평탄화
-  const reviews: MyReview[] = data?.pages?.flatMap((page) => page.list ?? []) ?? [];
+  const reviews: MyReview[] =
+    data?.pages
+      ?.flatMap((page) => page.list ?? [])
+      ?.sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()) ?? [];
 
   if (!data || data.pages[0].list.length === 0) {
     return <MyPageEmpty type='reviews' />;
@@ -70,8 +75,9 @@ export function ReviewList({ setTotalCount }: ReviewListProps) {
           key={review.id}
           rating={
             <Badge variant='star'>
-              <span className='inline-block w-full h-full pt-[2px]'>
-                ★ {review.rating.toFixed(1)}
+              <span className='flex items-center  gap-[2px] w-full h-full'>
+                <StarIcon className='w-[14px] h-[13px] pb-[2px]' />
+                {review.rating.toFixed(1)}
               </span>
             </Badge>
           }

src/components/my-profile/WineList.tsx

@@ -32,12 +32,14 @@ export function WineList({ setTotalCount }: WineListProps) {
   const [deleteWineId, setDeleteWineId] = useState<number | null>(null);
 
   //useInfiniteQuery 훅으로 와인 데이터를 무한 스크롤 형태로 조회
-  const { data, isError, fetchNextPage, hasNextPage, isFetchingNextPage } = useInfiniteQuery({
-    queryKey: ['wines'],
-    queryFn: ({ pageParam = 0 }) => getMyWines({ cursor: pageParam, limit: PAGE_LIMIT }),
-    initialPageParam: 0,
-    getNextPageParam: (lastPage: MyWinesResponse | undefined) => lastPage?.nextCursor ?? null,
-  });
+  const { data, isError, error, fetchNextPage, hasNextPage, isFetchingNextPage } = useInfiniteQuery(
+    {
+      queryKey: ['wines'],
+      queryFn: ({ pageParam = 0 }) => getMyWines({ cursor: pageParam, limit: PAGE_LIMIT }),
+      initialPageParam: 0,
+      getNextPageParam: (lastPage: MyWinesResponse | undefined) => lastPage?.nextCursor ?? null,
+    },
+  );
 
   useEffect(() => {
     if (data?.pages?.[0]?.totalCount != null) {
@@ -53,11 +55,11 @@ export function WineList({ setTotalCount }: WineListProps) {
     isFetching: isFetchingNextPage,
   });
 
-  // 로딩 및 에러 상태 처리 (임시)
-  if (isError || !data) return <p className='text-center py-4'>와인 불러오기 실패</p>;
+  if (isError) throw error;
 
   // 와인 목록 평탄화
-  const wines: MyWine[] = data?.pages?.flatMap((page) => page?.list ?? []) ?? [];
+  const wines: MyWine[] =
+    data?.pages?.flatMap((page) => page?.list ?? [])?.sort((a, b) => b.id - a.id) ?? [];
 
   if (!data || data.pages[0].list.length === 0) {
     return <MyPageEmpty type='wines' />;
@@ -100,7 +102,7 @@ export function WineList({ setTotalCount }: WineListProps) {
               {wine.region}
             </p>
             <Badge variant='priceBadge'>
-              <span className='inline-block w-full h-full pt-[3px]'>
+              <span className='inline-block w-full h-full md:pt-[3px] xl:pt-[2px]'>
                 ₩ {wine.price.toLocaleString()}
               </span>
             </Badge>

src/pages/my-profile/index.tsx

@@ -2,7 +2,6 @@ import React, { useEffect, useState } from 'react';
 
 import { useRouter } from 'next/router';
 
-import { LoadingOverlay } from '@/components/common/LoadingOverlay';
 import ErrorModal from '@/components/common/Modal/ErrorModal';
 import Profile from '@/components/my-profile/Profile';
 import { ReviewList } from '@/components/my-profile/ReviewList';
@@ -40,9 +39,6 @@ export default function MyProfile() {
 
   return (
     <div>
-      {/* 로딩 중일 때 전체 오버레이 */}
-      {isUserLoading && <LoadingOverlay />}
-
       <ErrorModal
         open={showModal}
         onOpenChange={() => {}}