Merge branch 'fe/develop' into fe/refactor/improve-design

frontend/src/api/reviewApi.ts

@@ -1,5 +1,5 @@
 import api from '@/api/axiosConfig';
-import { ReviewDetailResponse, ReviewRequest, ReviewResponse } from '@/types';
+import { ReviewDetailResponse, ReviewRequest, ReviewResponse, ReviewStatus } from '@/types';
 
 // 리뷰 단건 조회
 export async function getReviewDetail(projectId: number, reviewId: number, memberId: number) {
@@ -49,7 +49,7 @@ export async function getReviewByStatus(
   projectId: number,
   memberId: number,
   sortDirection: number,
-  reviewStatus?: 'REQUESTED' | 'APPROVED' | 'REJECTED',
+  reviewStatus?: ReviewStatus,
   lastReviewId?: number,
   limitPage: number = 10
 ) {

frontend/src/api/workspaceApi.ts

@@ -5,6 +5,7 @@ import {
   WorkspaceResponse,
   ReviewResponse,
   WorkspaceMemberResponse,
+  ReviewStatus,
 } from '@/types';
 
 export async function getWorkspaceList(memberId: number, lastWorkspaceId?: number, limit?: number) {
@@ -59,7 +60,7 @@ export async function getWorkspaceReviews(
   workspaceId: number,
   memberId: number,
   sortDirection: number,
-  reviewStatus?: 'REQUESTED' | 'APPROVED' | 'REJECTED',
+  reviewStatus?: ReviewStatus,
   lastReviewId?: number,
   limitPage: number = 10
 ) {

frontend/src/components/ReviewList/ReviewItem.tsx

@@ -4,13 +4,14 @@ import useProjectQuery from '@/queries/projects/useProjectQuery';
 import useAuthStore from '@/stores/useAuthStore';
 import { cn } from '@/lib/utils';
 import formatDateTime from '@/utils/formatDateTime';
+import { ReviewStatus } from '@/types';
 
 interface ReviewItemProps {
   title: string;
   createdTime: string;
   creatorName: string;
   projectId: number;
-  status: 'REQUESTED' | 'APPROVED' | 'REJECTED';
+  status: ReviewStatus;
   type?: { text: 'classification' | 'detection' | 'segmentation'; color: string };
   workspaceId: number;
   reviewId: number;

frontend/src/components/ReviewList/index.tsx

@@ -1,11 +1,11 @@
 import ReviewItem from './ReviewItem';
 import ReviewSearchInput from './ReviewSearchInput';
-import { ReviewResponse } from '@/types';
+import { ReviewResponse, ReviewStatus } from '@/types';
 
 interface ReviewListProps {
   reviews: ReviewResponse[];
-  activeTab: 'REQUESTED' | 'APPROVED' | 'REJECTED' | 'ALL';
+  activeTab: ReviewStatus | 'ALL';
-  setActiveTab: React.Dispatch<React.SetStateAction<'REQUESTED' | 'APPROVED' | 'REJECTED' | 'ALL'>>;
+  setActiveTab: React.Dispatch<React.SetStateAction<ReviewStatus | 'ALL'>>;
   setSearchQuery: React.Dispatch<React.SetStateAction<string>>;
   sortValue: string;
   setSortValue: React.Dispatch<React.SetStateAction<string>>;

frontend/src/components/WorkspaceSidebar/ProjectFileItem.tsx

@@ -64,7 +64,7 @@ export default function ProjectFileItem({
           size={12}
           className="shrink-0 stroke-blue-400"
         />
-      ) : item.status === 'REVIEW_REJECTED' ? (
+      ) : item.status === 'REVIEW_REJECT' ? (
         <CircleSlash
           size={12}
           className="shrink-0 stroke-red-400"

frontend/src/mocks/reviewHandlers.ts

@@ -1,5 +1,5 @@
 import { http, HttpResponse } from 'msw';
-import { ReviewDetailResponse, ReviewRequest, ReviewResponse, ReviewStatusRequest } from '@/types';
+import { ReviewDetailResponse, ReviewRequest, ReviewResponse, ReviewStatus, ReviewStatusRequest } from '@/types';
 
 export const reviewHandlers = [
   // 리뷰 단건 조회 핸들러
@@ -145,7 +145,7 @@ export const reviewHandlers = [
       reviewId: index + 1,
       title: `Review ${index + 1}`,
       content: `Review content ${index + 1}`,
-      status: (reviewStatus || 'REQUESTED') as 'REQUESTED' | 'APPROVED' | 'REJECTED',
+      status: (reviewStatus || 'REQUESTED') as ReviewStatus,
       createAt: new Date().toISOString(),
       updateAt: new Date().toISOString(),
       author: { id: 1, nickname: 'Author', profileImage: '', email: 'author@example.com' },

frontend/src/pages/ProjectReviewList.tsx

@@ -4,13 +4,14 @@ import useReviewByStatusQuery from '@/queries/reviews/useReviewByStatusQuery';
 import useAuthStore from '@/stores/useAuthStore';
 import ReviewList from '@/components/ReviewList';
 import { Button } from '@/components/ui/button';
+import { ReviewStatus } from '@/types';
 
 export default function ProjectReviewList() {
   const { workspaceId, projectId } = useParams<{ workspaceId: string; projectId: string }>();
   const profile = useAuthStore((state) => state.profile);
   const memberId = profile?.id || 0;
 
-  const [activeTab, setActiveTab] = useState<'REQUESTED' | 'APPROVED' | 'REJECTED' | 'ALL'>('REQUESTED');
+  const [activeTab, setActiveTab] = useState<ReviewStatus | 'ALL'>('REQUESTED');
   const [, setSearchQuery] = useState('');
   const [sortValue, setSortValue] = useState('latest');
 

frontend/src/pages/WorkspaceReviewList.tsx

@@ -4,13 +4,14 @@ import useWorkspaceReviewsQuery from '@/queries/workspaces/useWorkspaceReviewsQu
 import useAuthStore from '@/stores/useAuthStore';
 import ReviewList from '@/components/ReviewList';
 import { Button } from '@/components/ui/button';
+import { ReviewStatus } from '@/types';
 
 export default function WorkspaceReviewList() {
   const { workspaceId } = useParams<{ workspaceId: string }>();
   const profile = useAuthStore((state) => state.profile);
   const memberId = profile?.id || 0;
 
-  const [activeTab, setActiveTab] = useState<'REQUESTED' | 'APPROVED' | 'REJECTED' | 'ALL'>('REQUESTED');
+  const [activeTab, setActiveTab] = useState<ReviewStatus | 'ALL'>('REQUESTED');
   const [, setSearchQuery] = useState('');
   const [sortValue, setSortValue] = useState('latest');
 

frontend/src/queries/reviews/useReviewByStatusQuery.ts

@@ -1,11 +1,11 @@
 import { useSuspenseInfiniteQuery } from '@tanstack/react-query';
 import { getReviewByStatus } from '@/api/reviewApi';
-import { ReviewResponse } from '@/types';
+import { ReviewResponse, ReviewStatus } from '@/types';
 
 export default function useReviewByStatusQuery(
   projectId: number,
   memberId: number,
-  reviewStatus: 'REQUESTED' | 'APPROVED' | 'REJECTED' | undefined,
+  reviewStatus: ReviewStatus | undefined,
   sortDirection: number
 ) {
   return useSuspenseInfiniteQuery<ReviewResponse[]>({

frontend/src/queries/workspaces/useWorkspaceReviewsQuery.tsx

@@ -1,12 +1,12 @@
 import { useSuspenseInfiniteQuery } from '@tanstack/react-query';
 import { getWorkspaceReviews } from '@/api/workspaceApi';
-import { ReviewResponse } from '@/types';
+import { ReviewResponse, ReviewStatus } from '@/types';
 
 export default function useWorkspaceReviewsQuery(
   workspaceId: number,
   memberId: number,
   sortDirection: number,
-  reviewStatus?: 'REQUESTED' | 'APPROVED' | 'REJECTED',
+  reviewStatus?: ReviewStatus,
   limitPage: number = 10
 ) {
   return useSuspenseInfiniteQuery<ReviewResponse[]>({

frontend/src/types/imageTypes.ts

@@ -1,4 +1,4 @@
-export type ImageStatus = 'PENDING' | 'IN_PROGRESS' | 'SAVE' | 'REVIEW_REQUEST' | 'REVIEW_REJECTED' | 'COMPLETED';
+export type ImageStatus = 'PENDING' | 'IN_PROGRESS' | 'SAVE' | 'REVIEW_REQUEST' | 'REVIEW_REJECT' | 'COMPLETED';
 
 export interface ImageResponse {
   id: number;

frontend/src/types/reviewTypes.ts

@@ -1,6 +1,8 @@
 import { ImageStatus } from './imageTypes';
 import { MemberResponse } from './memberTypes';
 
+export type ReviewStatus = 'REQUESTED' | 'APPROVED' | 'REJECTED';
+
 // 리뷰 관련 DTO
 export interface ReviewRequest {
   title: string;
@@ -13,14 +15,14 @@ export interface ReviewResponse {
   projectId: number;
   title: string;
   content: string;
-  status: 'REQUESTED' | 'APPROVED' | 'REJECTED';
+  status: ReviewStatus;
   author: MemberResponse;
   createAt: string;
   updateAt: string;
 }
 
 export interface ReviewStatusRequest {
-  reviewStatus: 'REQUESTED' | 'APPROVED' | 'REJECTED';
+  reviewStatus: ReviewStatus;
 }
 
 export interface ReviewImageResponse {
@@ -35,7 +37,7 @@ export interface ReviewDetailResponse {
   reviewId: number;
   title: string;
   content: string;
-  reviewStatus: 'REQUESTED' | 'APPROVED' | 'REJECTED';
+  reviewStatus: ReviewStatus;
   images: ReviewImageResponse[];
   createdAt: string;
   updatedAt: string;