Skip to content

feat: 프로젝트 대시보드 UI 개선 및 동적 라우팅 적용 - #43

Merged
lnu8926-web merged 14 commits into
mainfrom
feat/issue-42-project-creation-modal
May 11, 2026
Merged

feat: 프로젝트 대시보드 UI 개선 및 동적 라우팅 적용#43
lnu8926-web merged 14 commits into
mainfrom
feat/issue-42-project-creation-modal

Conversation

@lnu8926-web

@lnu8926-web lnu8926-web commented May 11, 2026 •
edited
Loading

Copy link
Copy Markdown
Owner

Summary

Changes

기능

  • 프로젝트 생성 후 /project/workspace/{id}로 자동 이동
  • 초대 수락 후 동적 라우팅 적용 (InviteDecisionModal_V2)
  • /project/workspace → redirect("/"), /project/update → redirect("/")

UI/디자인

  • ProjectCard: 상태 dot, 날짜(CalendarDays 아이콘, 년월일 시분), hover reveal 액션 버튼
  • ProjectBoardFilter: pill 그룹 미니멀 스타일, 정렬 아이콘, 초기화 버튼
  • ProjectBoardHeader: 인라인 타이틀/서브타이틀 + 우측 "새 프로젝트" 버튼
  • ProjectBoardEmpty: 빈 상태 full redesign + 모달 직접 열기 CTA
  • Header: bg-card, 아이콘 버튼 border 스타일, 다크모드 토글

Test plan

  • 프로젝트 생성 후 워크스페이스로 정상 이동 확인
  • 브라우저 뒤로가기 후 URL 유효성 확인
  • 필터 변경 시 active pill 색상 변경 확인
  • 초기화 버튼 기본 필터에선 숨김, 비기본 상태에서 노출 확인
  • 카드 hover 시 편집/삭제 버튼 나타남 확인
  • 라이트/다크 모드 모두 가독성 확인

Closes #42
Closes #31
Closes #30

🤖 Generated with Claude Code

lnu8926-web and others added 14 commits May 11, 2026 23:47
@lnu8926-web @claude
feat(project): 프로젝트 생성 3-step 모달 (#42)
4d2bfa6 
- 기존 /project/create 페이지 진입 → 모달로 교체
- Step 1: 이름 / Step 2: 유형 카드 / Step 3: 기간 + 선택적 추가 입력
- 상태 자동 active, 시작일 자동 오늘 설정
- @radix-ui/react-collapsible 추가

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@lnu8926-web @claude
design: 세이지 & 더스트 컬러 팔레트 적용
7fff261 
라이트: #F1F3F2 base / #A3B18A accent / #344E41 foreground
다크: #1A2318 base / #B5C99A accent / #D4E0D4 foreground

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@lnu8926-web @claude
design: main-* 컬러 토큰 세이지 팔레트로 교체
d71accb 
main-50~main-800을 틸 계열 → 세이지 그린 계열로 재정의
버튼, 네비, 칸반 등 main-* 사용 컴포넌트 자동 반영

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@lnu8926-web @claude
design: 라이트 모드 컬러를 아이시 블루민트로 변경
14b3abc 
Base #EEF7F9 / Accent #5BBECE / Text #1A4A5A
main-* 토큰도 블루민트 계열로 동기화

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@lnu8926-web @claude
design: 라이트/다크 블루민트 팔레트 완성
e43da3a 
Light: #EEF7F9 bg / #5BBECE accent / #1A4A5A text
Dark:  #0D2530 bg / #6DD5E8 accent / #E8F5F7 text
main-* 스케일: #E8F5F7 ~ #0D2530 10단계 통일

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@lnu8926-web @claude
design: Figma 디자인 기반 헤더/빈 상태/모달 UI 정밀 개선
a44a30f 
- Header: bg-card(흰색)으로 변경, Taskry 텍스트 로고(teal) + 프로젝트 관리 플랫폼 서브타이틀 추가, 버튼 rounded-[10px] border 스타일 통일
- ProjectBoardEmpty: Figma 스펙대로 완전 재설계 (원형 아이콘 컨테이너 + CTA 버튼이 직접 모달 오픈)
- ProjectCreationModal: rounded-[14px], 진행바 비활성 bg-main-100, 버튼/카드 색상 main-500(#5bbece) 기준으로 정렬, 에러 메시지 가시성 수정

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@lnu8926-web @claude
feat(routing): sessionStorage 라우팅을 URL 기반 동적 라우팅으로 교체 (#31)
236ff16 
- workspace/[id]/page.tsx 생성: useParams로 projectId 읽음, sessionStorage 의존성 제거
- update/[id]/page.tsx 활성화: ProjectForm에 projectId prop 전달
- ProjectForm: sessionStorage 대신 projectId prop 수신
- ProjectCard: sessionStorage 제거, /project/workspace/:id / /project/update/:id 직접 push
- ProjectCreationModal: 생성 성공 후 /project/workspace/:id 로 자동 이동
- InviteDecisionModal: 초대 수락 후 URL 기반 워크스페이스 이동
- 기존 /project/workspace, /project/update 경로는 홈 리다이렉트 처리

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@lnu8926-web @claude
feat(filter): 필터 활성 상태 시각 피드백 구현 (#30)
28954d8 
Select 드롭다운을 pill 버튼 그룹으로 교체 — 선택된 값은 teal 배경으로 즉시 표시됨
- View(전체/내 프로젝트), 정렬 기준(시작일/마감일/생성일/수정일), 정렬 방향을 각각 토글 pill로 구현
- 기본값과 다른 필터가 하나라도 활성 시 '초기화' 버튼 노출

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@lnu8926-web @claude
design(dashboard): 프로젝트 대시보드 카드 및 헤더 UI 개선
a112708 
- ProjectCard: 타입 배지(팀/개인/학습/상용), 날짜 범위, 상태 배지(진행중/완료/일시정지) 추가. 설명 2줄 clamp, 푸터에 팀원 수 + 상태 + 편집/삭제 버튼 배치
- Card.tsx: hover 시 shadow-md + border-main-300 전환으로 인터랙션 강화
- ProjectBoardHeader: SectionHeader 제거, 타이틀/설명 인라인 + "새 프로젝트" 버튼 우측 정렬
- ProjectBoardBody: 그리드 클래스 정리

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@lnu8926-web @claude
design(card): 모던/심플 스타일로 ProjectCard 리디자인
5ad75ca 
- 타입 배지 제거, 상태를 컬러 도트 + 텍스트로 간소화
- 편집·삭제 버튼 호버 시에만 노출 (opacity transition)
- 카드 hover: shadow-lg + -translate-y-0.5 리프트 효과
- 날짜 범위를 "Jan 2025 – Jun 2025" 간결 포맷으로 표시
- 전체 레이아웃 여백 정리, 시각적 노이즈 최소화

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@lnu8926-web @claude
design(filter): 필터바 미니멀 리디자인
2891b16 
컨테이너 박스 제거, 버튼 플랫 배치 — 활성 상태를 solid fill → 연한 tint(main-500/10)로
정렬 방향을 텍스트 없이 아이콘만으로 간소화, 초기화 버튼 RotateCcw 아이콘 + 소형 텍스트

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@lnu8926-web @claude
design: 카드·필터 텍스트 가독성 개선
b6ce46f 
muted-foreground(teal #3A8A9A)를 설명/메타/비활성 텍스트에 쓰던 것을 neutral gray로 교체 —
제목(foreground) → 설명(gray-500) → 메타(gray-400) 3단계 위계 명확화

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@lnu8926-web @claude
design(card): 날짜를 별도 행으로 분리해 가시성 개선
01fc5a0 
설명 아래 CalendarDays 아이콘(teal) + 날짜 텍스트를 독립 행으로 배치,
팀원 수와 분리하여 스캔 시 명확하게 인식되도록 함

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@lnu8926-web @claude
fix(card): 날짜 포맷을 년월일 시분까지 표시하도록 변경
16e6eb2 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
@vercel

vercel Bot commented May 11, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
next_taskry Error Error May 11, 2026 5:18pm

@lnu8926-web
lnu8926-web merged commit 2a5d79e into main May 11, 2026
1 of 3 checks passed
@lnu8926-web
lnu8926-web deleted the feat/issue-42-project-creation-modal branch May 11, 2026 17:18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

1 participant

@lnu8926-web