Enhance search with fuzzy match, ranking, and live highlight across Data Explorer & Editor #12

New Issue

lectom · 2026-01-09T19:32:41+09:00

lectom commented

2026-01-09 19:32:41 +09:00

목표

Data Explorer와 Editor(파싱 이후 데이터 뷰) 모두에서 공통으로 사용할 수 있는 검색 개선 기능 추가.
검색 입력 시 fuzzy 매칭을 수행하고, 랭킹 정보(매칭 스코어/일치 위치 등)를 활용해 정렬.
검색 결과 표에서 매칭된 텍스트를 실시간 하이라이팅해 사용자가 일치 구간을 바로 확인할 수 있도록 함.

요구사항

공통 검색 유틸/서비스: Data Explorer와 Editor가 재사용할 수 있는 검색/랭킹 모듈 설계.
Fuzzy 검색: 부분 일치, 오타 허용(levenshtein/ratio 기반 등) 또는 trigram류를 활용해 랭킹 계산.
랭킹/정렬: 매칭 스코어를 기준으로 정렬 옵션 제공(기본값: 최고점 우선), 동일 점수 시 기존 정렬 유지.
실시간 하이라이트: 사용자가 입력할 때마다 결과 표 내 매칭된 문자열을 마크업 처리(React/Blazor 등 현재 UI 스택에 맞게 span 래핑).
퍼포먼스: 데이터량이 많을 때도 UI 프리즈 없이 동작해야 함. 필요 시 디바운싱(예: 150~300ms) 적용.
접근성/스타일: 하이라이트 색상 대비 확보, 키보드 탐색 시 포커스에 영향 없게.
설정/옵션: 검색 민감도(스코어 컷오프), 정렬 On/Off, 하이라이트 On/Off 등의 토글 고려.
테스트: 유닛/통합 테스트로 주요 케이스(완전일치, 부분일치, 오타, 빈 검색어, 대량 데이터) 검증.

고려사항

클라이언트에서 처리할지 서버에서 처리할지 결정(데이터 규모에 따라 선택지 마련).
QuickGrid/테이블 구성 요소에서 하이라이트를 적용할 때 XSS/인코딩 안전성 유지.
기존 검색 필터 로직과의 호환성 확인(현행 단순 contains 필터 대체 또는 옵션 제공).

산출물

공통 검색/랭킹 유틸/서비스 코드 및 재사용 예시(Data Explorer, Editor에 각각 적용 샘플).
UI 동작 데모(간단한 스크린샷/애니메이션 설명) 또는 PR 설명.
테스트 케이스(주요 시나리오 커버).

## 목표 - Data Explorer와 Editor(파싱 이후 데이터 뷰) 모두에서 공통으로 사용할 수 있는 검색 개선 기능 추가. - 검색 입력 시 fuzzy 매칭을 수행하고, 랭킹 정보(매칭 스코어/일치 위치 등)를 활용해 정렬. - 검색 결과 표에서 매칭된 텍스트를 실시간 하이라이팅해 사용자가 일치 구간을 바로 확인할 수 있도록 함. ## 요구사항 - **공통 검색 유틸/서비스**: Data Explorer와 Editor가 재사용할 수 있는 검색/랭킹 모듈 설계. - **Fuzzy 검색**: 부분 일치, 오타 허용(levenshtein/ratio 기반 등) 또는 trigram류를 활용해 랭킹 계산. - **랭킹/정렬**: 매칭 스코어를 기준으로 정렬 옵션 제공(기본값: 최고점 우선), 동일 점수 시 기존 정렬 유지. - **실시간 하이라이트**: 사용자가 입력할 때마다 결과 표 내 매칭된 문자열을 마크업 처리(React/Blazor 등 현재 UI 스택에 맞게 span 래핑). - **퍼포먼스**: 데이터량이 많을 때도 UI 프리즈 없이 동작해야 함. 필요 시 디바운싱(예: 150~300ms) 적용. - **접근성/스타일**: 하이라이트 색상 대비 확보, 키보드 탐색 시 포커스에 영향 없게. - **설정/옵션**: 검색 민감도(스코어 컷오프), 정렬 On/Off, 하이라이트 On/Off 등의 토글 고려. - **테스트**: 유닛/통합 테스트로 주요 케이스(완전일치, 부분일치, 오타, 빈 검색어, 대량 데이터) 검증. ## 고려사항 - 클라이언트에서 처리할지 서버에서 처리할지 결정(데이터 규모에 따라 선택지 마련). - QuickGrid/테이블 구성 요소에서 하이라이트를 적용할 때 XSS/인코딩 안전성 유지. - 기존 검색 필터 로직과의 호환성 확인(현행 단순 contains 필터 대체 또는 옵션 제공). ## 산출물 - 공통 검색/랭킹 유틸/서비스 코드 및 재사용 예시(Data Explorer, Editor에 각각 적용 샘플). - UI 동작 데모(간단한 스크린샷/애니메이션 설명) 또는 PR 설명. - 테스트 케이스(주요 시나리오 커버).

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: cyhan/bim-dogma-poc#12