Project

General

Profile

Actions

새기능 #67

open

[프론트/백엔드] Artist 검색 드롭다운 UI 개선 및 검색 최적화

Added by joungmin ko 3 months ago.

Status:
신규
Priority:
보통
Assignee:
-
Start date:
03/20/2026
Due date:
% Done:

0%

Estimated time:

Description

변경 내역

1. 드롭다운 잘림 버그 수정

  • globals.css: html의 overflow-x-hidden 제거 (body에만 유지)
  • 원인: html+body 양쪽에 overflow-x-hidden 설정 시 브라우저가 overflow-y:auto를 자동 적용하여 absolute 요소가 잘림
  • artist/page.tsx: 검색 헤더에 relative z-10 추가 (곡 목록 위에 드롭다운 표시)

2. 검색 결과 최적화

  • 백엔드 SQL (ChartMapper.xml): 3단계 우선순위 정렬 (정확매칭→접두어→포함) + FETCH FIRST 15 ROWS ONLY 추가
  • 기존: 585개 전체 반환 (27KB), 관련도 정렬 없음
  • 개선: 15개 제한, 접두어 시작 아티스트 우선 표시

3. 프론트엔드 드롭다운 UX 개선

  • max-h-[300px] overflow-y-auto 스크롤 지원 (Song 탭과 동일)
  • 15개 초과 시 하단에 총 결과 수 안내 표시
  • Enter 키로 첫 번째 결과 자동 선택
  • 기존 8개 하드컷 제거

변경 파일

  • frontend/app/globals.css
  • frontend/app/artist/page.tsx
  • frontend/components/artist/artist-search.tsx
  • src/main/resources/mapper/ChartMapper.xml

No data to display

Actions

Also available in: Atom PDF