Commit Graph

8 Commits

Author SHA1 Message Date
joungmin
730727a7a6 test(frontend): #343 Jest+RTL 인프라 + ARIA Tabs + remotePatterns
테스트 인프라:
- Jest 30 + jest-environment-jsdom + RTL + jest-dom matchers
- next/jest로 SWC/Next.js 자동 통합
- jest.config.ts (setupFilesAfterEnv) + jest.setup.ts
- npm scripts: test, test:watch
- 샘플 테스트 3개, 13/13 통과:
  - i18n/config: isLocale + detectBrowserLocale (5 케이스)
  - Stars 컴포넌트: 별점/aria/clamp/showNumber (5 케이스)
  - admin-utils: getAdminToken + authHeaders (4 케이스)

ARIA Tabs (MyReviewsList):
- role=tablist + tab + aria-selected + aria-controls + tabIndex
- panel에 role=tabpanel + aria-labelledby

next/image:
- next.config.ts remotePatterns: lh3.googleusercontent.com / i.ytimg.com / yt3.ggpht.com
- ReviewSection의 user_avatar_url에 명시적 eslint-disable + 사유

후속(별도): 전체 컴포넌트 테스트 점진 추가, 백엔드 JUnit 인프라, E2E (Playwright), CI 통합

설계서: docs/design/343-frontend-test-infra/README.md

Refs: #343
2026-06-15 16:25:55 +09:00
joungmin
bff3dcc200 feat(ui): P4-4 별점 공통화 + 로그인 모달 접근성 (#281+#283)
#281 (리뷰/메모 UI):
- Stars 컴포넌트 신규 (lib 분리 가능한 공통 별점) — 0.5 단위 절반 채우기 시각 구분
- ReviewSection/MemoSection의 StarDisplay 제거 → 공통 Stars 사용 (시각 일관성)
- StarSelector: role='radiogroup'/role='radio' + aria-checked, 44×44px 터치 영역,
  반쪽 별 '⯨' 표시로 시각 차별화
- ReviewSection/MemoSection: API 실패 try/catch + alert 사용자 피드백
- MyReviewsList: Math.round 별점 → Stars 0.5단위 정확 렌더

#283 (로그인 메뉴):
- LoginMenu: useEscapeKey + useFocusTrap + useBodyScrollLock 적용
- role='dialog' / aria-modal / aria-labelledby / aria-label='로그인 창 닫기'
- onError 콘솔만 → 인라인 role='alert' 메시지로 사용자 피드백
- max-w-xs → max-w-sm (위젯 260px + 패딩 24px = 308px 안전 수용)

후속 분리:
- #343 (next/image + ARIA Tabs + Stars 테스트)
- #344 (z-index 토큰 + i18n)

Refs: #281 #283
2026-06-15 14:33:15 +09:00
joungmin
3134994817 비공개 메모 기능 추가 + 아이콘 개선
- 식당별 1:1 비공개 메모 CRUD (user_memos 테이블)
- 내 기록에 리뷰/메모 탭 분리
- 백오피스 유저 관리에 메모 수/상세 표시
- 리뷰/메모 작성 시 현재 날짜 기본값
- 지도우선/목록우선 버튼 Material Symbols 아이콘 적용

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-12 14:10:06 +09:00
joungmin
50018c17fa Saffron 디자인 시스템 적용: 브랜드 컬러 + Pretendard 폰트 + 크림 배경
- CSS 변수 기반 brand-50~950 컬러 팔레트 추가 (Tailwind @theme inline)
- Pretendard Variable 폰트 로드 및 기본 폰트로 설정
- 라이트모드 배경 #FFFAF5 크림색 적용 (다크모드 기본 유지)
- 전체 컴포넌트 orange-* → brand-* 마이그레이션
- 식당 리스트 채널명에 YouTube SVG 아이콘 추가
- 디자인 컨셉 문서 추가 (docs/design-concepts.md)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-11 21:15:45 +09:00
joungmin
6223691b33 Add dark mode with system preference auto-detection
All user-facing components now support dark mode via prefers-color-scheme.
- Dark backgrounds: gray-950/900/800
- Dark text: gray-100/200/300/400
- Orange brand colors adapt with darker tints
- Glass effects work in both modes
- Skeletons, cards, filters, bottom sheet all themed
- Google Maps InfoWindow stays light (maps don't support dark)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 16:14:29 +09:00
joungmin
4a1c8cf1cd Unify color scheme: orange primary, rose accent, gray neutral
- Primary (orange): search button, active filters, selected cards,
  channel tags, links, input focus ring
- Accent (rose): favorites/heart only
- Neutral (gray): price tags, inactive buttons
- Semantic colors preserved: red for 폐업, yellow for 임시휴업

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 16:00:13 +09:00
joungmin
4d09be2419 Add skeleton loading UI for better perceived performance
Replace "로딩 중..." text with animated skeleton placeholders in
RestaurantList, RestaurantDetail, and ReviewSection components.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 11:08:03 +09:00
joungmin
36bec10bd0 Initial commit: Tasteby - YouTube restaurant map service
Backend (FastAPI + Oracle ADB), Frontend (Next.js), daemon worker.
Features: channel/video/restaurant management, semantic search,
Google OAuth, user reviews.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-06 13:47:19 +09:00