feat: EmptyState 재사용 컴포넌트 기능 개발 #10
Conversation
There was a problem hiding this comment.
Pull Request Overview
This PR introduces a reusable EmptyState component for displaying empty or no-data states with customizable icons, text, and action buttons. The component supports both light and dark modes with hover and active state styling.
- Added EmptyState component with TypeScript definitions
- Implemented responsive design with Tailwind CSS for light/dark mode support
- Included comprehensive documentation and usage examples
Reviewed Changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| src/features/Empty/type.ts | Defines TypeScript interfaces for EmptyState component props |
| src/features/Empty/index.tsx | Main EmptyState component implementation with styling and documentation |
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
src/components/Empty/type.ts
Outdated
| }; | ||
|
|
||
| // Empty State 관리 | ||
| export interface EmptyStateProps { |
There was a problem hiding this comment.
컨벤션 변경으로 컴포넌트와 같은 파일로 있어야할 것 같습니당
| <p className="text-wh/75 dark:text-wh/70 label-text-s text-[15px]">{description}</p> | ||
| </div> | ||
|
|
||
| {action && ( |
There was a problem hiding this comment.
actionIcon이 action에 종속적이면 action type에 포함되는건 어떨지 제안드립니당
There was a problem hiding this comment.
생각해보니 action 관련 영역에서 이루어지는 활동들이기에 icon을 따로 빼는 것이 아닌 action type에 포함되는게 맞겠네요!
위에 컨벤션 수정하면서 추가적으로 작업하도록 하겠습니다. 감사합니다.
|
확인했습니다 수고하셨습니당 |
There was a problem hiding this comment.
Pull Request Overview
Copilot reviewed 1 out of 1 changed files in this pull request and generated 3 comments.
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
3 participants
📖 개요
✅ 관련 이슈
🛠️ 상세 작업 내용
📸 스크린샷 (옵션)
👥 리뷰 확인 사항 (옵션)
라이트모드, 다크모드별 렌더링 확인까지는 확인을 했습니다.
추가적으로 구현되면 좋겠다라는 부분이 있으면 말씀해주세요!