본문으로 건너뛰기

ADR-010 — Data Map / Data Navigation UI (4-perspective visualisation)

항목
StatusProposed (2026-05-25 — #990 design step)
Date2026-05-25
DeciderGenD 코어팀 + UI/UX
Related Epic#990 (Data Map / Data Navigation UI — RFP SFR-006)
Related Issue#992 (자연어 카탈로그 검색 — 본 UI 의 검색 백엔드)

한 줄 결정: 시스템 / 업무 / 유형 / 생성주체 4개 관점 트리 + xyflow 그래프 듀얼 뷰. ABAC 가시성 필터링은 기존 DataAccessService 재사용.

결정

1) 4-Perspective navigation

사이드바 상단의 Perspective 탭[시스템] [업무] [유형] [생성주체]

계층출처
시스템catalog → schema → table → columnTrino 메타데이터
업무domain → subdomain → tabletable_metadata.domain
유형medallion bronze/silver/gold → tabletable_metadata.layer
생성주체owner → tabletable_metadata.owner

기존 table_metadata (ADR-006 / #545) 의 domain / layer / owner 컬럼이 모두 perspective key 로 활용.

2) Dual view

  • 트리 뷰 — 좌측 nav. 클릭으로 expand/collapse. ABAC 필터링 적용.
  • 그래프 뷰 — 우측 main. @xyflow/react 활용. lineage upstream/downstream + foreign-key 관계 시각화. 그래프 노드 클릭 시 detail panel (메타 / 샘플 / 프로파일 / 리니지 / 품질 / PII).
  • 좌/우 동기화 — 어느 한 쪽에서 선택 시 다른 쪽 highlight.

3) 검색 결과 캐싱

검색 결과 (자연어 / 키워드) → search_cache 테이블 (workspace_id + query hash + result IDs + expires_at). TTL 1h. 동일 쿼리 hit 시 캐시 응답 + cached_at 헤더 노출.

4) 인기·추천 검색어

  • 인기: search_history 테이블에서 24h rolling 상위 10개 + workspace 필터.
  • 추천: 사용자의 ResourceGroup / domain 기반 — 동일 부서 사용자의 24h 검색 상위 5개 (개인정보 제외 hash).

5) ABAC 가시성

검색·트리·그래프 모두 DataAccessService.filter_visible_tables 통과. lineage 노드는 catalog.schema.table 권한 없으면 음영 처리 (시각적으로 존재 인지 + 클릭 차단).

영향

  • 새 UI 페이지: ui/src/components/data-map/ (DataMapPage / PerspectiveSidebar / DataMapGraph / DetailPanel)
  • 새 API: GET /api/v1/data-map/perspectives, GET /api/v1/data-map/graph, POST /api/v1/data-map/search
  • 새 테이블: search_cache, search_history
  • xyflow 라이브러리: 이미 사용 (Schema Graph 페이지)
  • Prerequisite: #992 (자연어 검색 backend), #1018 (Workspace Isolation) — workspace scope 필터링

비목표

  • 외부 데이터 자산 (S3 raw / SFTP file / SaaS metadata) 표시는 본 ADR 범위 밖. Iceberg 기반 known catalog 만.
  • 그래프 layout 알고리즘은 dagre default. 사용자 커스텀 (force-directed / radial) 은 별도.
  • mobile-first responsive 는 본 Phase 비목표 — desktop ≥1280px 우선.