Feat/modify UI ux

[GulSam00]

📌 PR 제목

Fix : 검색 곡 카드 디자인 개선, 로컬 스토리지 검색어 저장 기능 개선

📌 변경 사항

• 로컬 스토리지 로직을 hook으로 각자 호출해서 생겼던 이슈 해결
• 곡 디자인 개선

💬 추가 참고 사항

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
singcode	Error		Feb 2, 2026 4:25pm

[Copilot]

Pull request overview

이 PR은 검색 기능의 UX/UI 개선과 로컬 스토리지 관리 방식을 개선합니다. 기존에 각 컴포넌트에서 독립적으로 로컬 스토리지를 관리하던 방식에서 Zustand를 활용한 중앙 집중식 상태 관리로 전환하여 일관성 문제를 해결했습니다.

Changes:

• 검색 히스토리를 관리하는 커스텀 훅(useSearchHistory)을 Zustand store(useSearchHistoryStore)로 마이그레이션
• 검색 결과 카드 UI 디자인 개선 및 아티스트 클릭 기능 추가
• 다른 store들의 initialState 패턴 통일

Reviewed changes

Copilot reviewed 11 out of 12 changed files in this pull request and generated 4 comments.

Show a summary per file

File	Description
apps/web/src/stores/useSearchHistoryStore.ts	localStorage 기반 검색 히스토리를 Zustand persist 미들웨어로 구현한 새로운 store 추가
apps/web/src/stores/useModalStore.ts	initialState 패턴 적용 및 closeMessage 시 초기 상태로 완전히 리셋하도록 개선
apps/web/src/stores/useAuthStore.ts	initialState 패턴 적용 및 logout 시 초기 상태로 완전히 리셋하도록 개선
apps/web/src/hooks/useSearchSong.ts	useSearchHistory hook에서 useSearchHistoryStore로 마이그레이션
apps/web/src/hooks/useSearchHistory.ts	Zustand store로 대체되어 삭제됨
apps/web/src/app/search/SearchResultCard.tsx	카드 레이아웃 개선, absolute 포지셔닝 제거, 아티스트 클릭 기능 추가
apps/web/src/app/search/HomePage.tsx	ScrollArea를 일반 div로 변경, useEffect 위치 이동, 아티스트 클릭 핸들러 추가
apps/web/public/changelog.json	버전 2.0.1 변경사항 추가
apps/web/package.json	버전을 1.9.1에서 2.0.1로 업데이트
apps/web/GEMINI.md	웹 앱의 기술 스택 및 컨벤션 문서 추가
GEMINI.md	프로젝트 전체 구조 및 기술 스택 문서 추가
.gitignore	temp/ 디렉토리 추가

[Copilot]

ScrollArea를 일반 div로 변경했습니다. 프로젝트 전반에서 ScrollArea 컴포넌트를 사용하고 있는 패턴(apps/web/src/app/info/like/page.tsx:46, apps/web/src/app/info/save/page.tsx:194, apps/web/src/app/popular/page.tsx:22, apps/web/src/app/tosing/page.tsx:29)과 일관성이 떨어집니다. 특별한 이유가 없다면 ScrollArea 컴포넌트를 계속 사용하는 것을 권장합니다.

[Copilot]

가수명을 클릭할 수 있는 기능을 추가했습니다. button 또는 role="button"을 사용하고 키보드 접근성(onKeyDown 또는 onKeyPress)을 추가하는 것을 권장합니다. 현재는 마우스 클릭만 가능하여 키보드 사용자가 이 기능을 사용할 수 없습니다.

[Copilot]

디버깅용 console.log가 남아있습니다. 프로덕션 코드에서는 제거해주세요.

Suggested change

console.log('parsedSearch ', parsedSearch);

[Copilot]

useSearchHistoryStore는 다른 store들(useAuthStore, useModalStore)과 달리 default export가 아닌 named export로 되어있습니다. 코드베이스의 일관성을 위해 'export default useSearchHistoryStore'로 변경하는 것을 권장합니다. 다른 store 파일들(useAuthStore.ts:264, useModalStore.ts:56)을 참고해주세요.