From d0951d0ede92d9a2ff483f57fd1a87e06a589b14 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EC=A0=95=ED=98=84=EC=A1=B0?= Date: Thu, 5 Sep 2024 17:59:48 +0900 Subject: [PATCH] =?UTF-8?q?Refactor:=20=EC=9D=B4=EB=A6=84=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD=20=ED=8C=8C=EC=9D=BC=20=EB=93=B1=20=EC=82=AD=EC=A0=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ReviewQuest/ReviewRequestItem.stories.tsx | 39 ----- .../ReviewQuest/ReviewRequestItem.tsx | 80 ---------- .../ReviewQuest/ReviewSearchInput.tsx | 48 ------ .../components/ReviewQuest/index.stories.tsx | 78 --------- frontend/src/components/ReviewQuest/index.tsx | 151 ------------------ 5 files changed, 396 deletions(-) delete mode 100644 frontend/src/components/ReviewQuest/ReviewRequestItem.stories.tsx delete mode 100644 frontend/src/components/ReviewQuest/ReviewRequestItem.tsx delete mode 100644 frontend/src/components/ReviewQuest/ReviewSearchInput.tsx delete mode 100644 frontend/src/components/ReviewQuest/index.stories.tsx delete mode 100644 frontend/src/components/ReviewQuest/index.tsx diff --git a/frontend/src/components/ReviewQuest/ReviewRequestItem.stories.tsx b/frontend/src/components/ReviewQuest/ReviewRequestItem.stories.tsx deleted file mode 100644 index a58e92d..0000000 --- a/frontend/src/components/ReviewQuest/ReviewRequestItem.stories.tsx +++ /dev/null @@ -1,39 +0,0 @@ -import '@/index.css'; -import type { Meta, StoryObj } from '@storybook/react'; -import ReviewRequestItem from './ReviewRequestItem'; - -const meta: Meta = { - title: 'Components/ReviewRequestItem', - component: ReviewRequestItem, - argTypes: { - title: { control: 'text', description: 'Title of the review request' }, - createdTime: { control: 'text', description: 'Time when the review was created' }, - creatorName: { control: 'text', description: 'Name of the creator' }, - project: { control: 'text', description: 'Project name' }, - status: { control: 'text', description: 'Status of the review request' }, - commentsCount: { control: 'number', description: 'Number of comments' }, - updatesCount: { control: 'number', description: 'Number of updates' }, - lastUpdated: { control: 'text', description: 'Time when the review was last updated' }, - type: { - control: 'object', - description: 'Label for the request type with text and color', - }, - }, -}; - -export default meta; -type Story = StoryObj; - -export const Default: Story = { - args: { - title: 'Feat: 워크스페이스 멤버 추가 구현 - S11P21S002-37', - createdTime: '!24 · created 2 hours ago', - creatorName: '김태수', - project: 'be/develop', - status: 'Merged', - commentsCount: 4, - updatesCount: 1, - lastUpdated: 'updated 1 hour ago', - type: { text: 'Classification', color: '#a2eeef' }, - }, -}; diff --git a/frontend/src/components/ReviewQuest/ReviewRequestItem.tsx b/frontend/src/components/ReviewQuest/ReviewRequestItem.tsx deleted file mode 100644 index 3bdaf9a..0000000 --- a/frontend/src/components/ReviewQuest/ReviewRequestItem.tsx +++ /dev/null @@ -1,80 +0,0 @@ -import { Briefcase, MessageCircle, RefreshCw, Tag, Box, Layers, Pen } from 'lucide-react'; - -interface ReviewRequestItemProps { - title: string; - createdTime: string; - creatorName: string; - project: string; - status: string; - commentsCount: number; - updatesCount: number; - lastUpdated: string; - type: { text: 'Classification' | 'Detection' | 'Polygon' | 'Polyline'; color: string }; -} - -const typeIcons: Record<'Classification' | 'Detection' | 'Polygon' | 'Polyline', JSX.Element> = { - Classification: , - Detection: , - Polygon: , - Polyline: , -}; - -const typeStyles: Record<'Classification' | 'Detection' | 'Polygon' | 'Polyline', string> = { - Classification: '#a2eeef', - Detection: '#d4c5f9', - Polygon: '#f9c5d4', - Polyline: '#c5f9d4', -}; - -export default function ReviewRequestItem({ - title, - createdTime, - creatorName, - project, - status, - commentsCount, - updatesCount, - lastUpdated, - type, -}: ReviewRequestItemProps) { - const icon = typeIcons[type.text]; - const bgColor = typeStyles[type.text]; - - return ( -
-
-

{title}

-

- {createdTime} by {creatorName} -

-
- -

{project}

-
- {type && ( -
- {icon} - {type.text} -
- )} -
-
-
-
{status}
-
- - {commentsCount} -
-
- - {updatesCount} -
-
-

{lastUpdated}

-
-
- ); -} diff --git a/frontend/src/components/ReviewQuest/ReviewSearchInput.tsx b/frontend/src/components/ReviewQuest/ReviewSearchInput.tsx deleted file mode 100644 index 45b667f..0000000 --- a/frontend/src/components/ReviewQuest/ReviewSearchInput.tsx +++ /dev/null @@ -1,48 +0,0 @@ -import { Select, SelectTrigger, SelectContent, SelectItem, SelectValue } from '@/components/ui/select'; -import SearchInput from '@/components/ui/search-input'; -import { cn } from '@/lib/utils'; - -const sortOptions = [ - { value: 'latest', label: '최신 순' }, - { value: 'oldest', label: '오래된 순' }, - { value: 'comments', label: '댓글 많은 순' }, - { value: 'updates', label: '업데이트 많은 순' }, -]; - -interface ReviewSearchInputProps { - onSearchChange: (value: string) => void; - onSortChange: (value: string) => void; - sortValue: string; -} - -export default function ReviewSearchInput({ onSearchChange, onSortChange, sortValue }: ReviewSearchInputProps) { - return ( -
-
- onSearchChange(e.target.value)} - /> - -
-
- ); -} diff --git a/frontend/src/components/ReviewQuest/index.stories.tsx b/frontend/src/components/ReviewQuest/index.stories.tsx deleted file mode 100644 index 21fb3df..0000000 --- a/frontend/src/components/ReviewQuest/index.stories.tsx +++ /dev/null @@ -1,78 +0,0 @@ -import '@/index.css'; -import type { Meta, StoryObj } from '@storybook/react'; -import ReviewRequest from '.'; - -const meta: Meta = { - title: 'Components/ReviewRequest', - component: ReviewRequest, -}; - -export default meta; - -type Story = StoryObj; - -export const Default: Story = { - args: { - acceptedCount: 10, - rejectedCount: 5, - pendingCount: 7, - totalCount: 22, - items: [ - { - title: '갤럭시22 생산 라인 이물질 분류', - createdTime: '2 hours ago', - creatorName: 'Kim Tae Su', - project: 'Project A', - type: 'Classification', - status: 'needs_review', - commentsCount: 4, - updatesCount: 1, - lastUpdated: '1 hour ago', - }, - { - title: '갤럭시 흠집 객체 탐지', - createdTime: '3 hours ago', - creatorName: 'Kim Tae Su', - project: 'Project B', - type: 'Detection', - status: 'completed', - commentsCount: 2, - updatesCount: 3, - lastUpdated: '30 minutes ago', - }, - { - title: '갤럭시 흠집 경계 폴리곤', - createdTime: '5 hours ago', - creatorName: 'Kim Tae Su', - project: 'Project C', - type: 'Polygon', - status: 'in_progress', - commentsCount: 3, - updatesCount: 2, - lastUpdated: '2 hours ago', - }, - { - title: '갤럭시 흠집 폴리라인', - createdTime: '1 day ago', - creatorName: 'Kim Tae Su', - project: 'Project D', - type: 'Polyline', - status: 'completed', - commentsCount: 5, - updatesCount: 0, - lastUpdated: '20 minutes ago', - }, - { - title: '갤럭시 흠집 디텍션 허가 요청', - createdTime: '6 hours ago', - creatorName: 'Kim Tae Su', - project: 'Project E', - type: 'Detection', - status: 'pending', - commentsCount: 1, - updatesCount: 4, - lastUpdated: '3 hours ago', - }, - ], - }, -}; diff --git a/frontend/src/components/ReviewQuest/index.tsx b/frontend/src/components/ReviewQuest/index.tsx deleted file mode 100644 index 80e3267..0000000 --- a/frontend/src/components/ReviewQuest/index.tsx +++ /dev/null @@ -1,151 +0,0 @@ -import { useState } from 'react'; -import ReviewRequestItem from './ReviewRequestItem'; -import ReviewSearchInput from './ReviewSearchInput'; - -interface ReviewRequestProps { - acceptedCount: number; - rejectedCount: number; - pendingCount: number; - totalCount: number; - items: { - title: string; - createdTime: string; - creatorName: string; - project: string; - type: 'Classification' | 'Detection' | 'Polygon' | 'Polyline'; - status: string; - commentsCount: number; - updatesCount: number; - lastUpdated: string; - }[]; -} - -const typeColors: Record<'Classification' | 'Detection' | 'Polygon' | 'Polyline', string> = { - Classification: '#a2eeef', - Detection: '#d4c5f9', - Polygon: '#f9c5d4', - Polyline: '#c5f9d4', -}; - -export default function ReviewRequest({ - acceptedCount, - rejectedCount, - pendingCount, - totalCount, - items, -}: ReviewRequestProps): JSX.Element { - const [activeTab, setActiveTab] = useState('pending'); - const [searchQuery, setSearchQuery] = useState(''); - const [sortValue, setSortValue] = useState('latest'); - - const filteredItems = items - .filter((item) => { - if (activeTab === 'pending') return item.status.toLowerCase() === 'needs_review'; - if (activeTab === 'accepted') return item.status.toLowerCase() === 'completed'; - if (activeTab === 'rejected') return ['in_progress', 'pending'].includes(item.status.toLowerCase()); - if (activeTab === 'all') return true; - return false; - }) - .filter((item) => item.title.includes(searchQuery)) - .sort((a, b) => { - switch (sortValue) { - case 'oldest': - return new Date(a.createdTime).getTime() - new Date(b.createdTime).getTime(); - case 'comments': - return b.commentsCount - a.commentsCount; - case 'updates': - return b.updatesCount - a.updatesCount; - default: - return new Date(b.createdTime).getTime() - new Date(a.createdTime).getTime(); - } - }); - - return ( -
-
-
- - - - - - - -
-
- -
- -
- -
- {filteredItems.map((item, index) => ( - - ))} -
-
- ); -}