시트 UX 개선 요구사항 — 2차 피드백 정리 (2026-07-07, STG 테스트)
원본: STG 사용자 테스트 피드백 (2026-07-07). 1차: sheet-ux-feedback-2026-07.md (19건 전체 종결). 구현 구조 참고: 참조·수식 설계 · 셀 병합 설계
상태: 🐛 버그(원인 특정) · ✅ 방향 확정 · 💡 설계 필요 · 🔍 원인 추적 필요 · 🚚 PR #405 미배포 추정 (STG가 구버전 — 배포 후 재확인) · ⏸ 요구사항 보완 대기 · ❌ 반영 안 함
한 줄 진단
24건 전체 종결 (2026-07-07). 4건은 PR #405 기구현(STG 재확인 생략 — 사용자 결정), 엑셀 내보내기 버그 수정, 나머지 신규 개선 전부 구현·라이브 검증 완료.
0. PR #405에 이미 구현된 항목 (종결 — 2026-07-07 사용자 결정: STG 재확인 생략)
| # | 피드백 | PR #405 구현 내역 | (참고) 확인 방법 |
|---|
| 0-1 | 🚚 "undo: 행 드래그·열 설정·표시 형식 변경 안 됨" | A-1 구조 undo: row-move(행 드래그) · col-config(열 설정 저장 — 표시 형식 변경 포함, 열 설정 모달 저장 경로가 format을 patch로 묶음) · col-move · col-rename · style · merge/unmerge | 행 드래그 → Ctrl+Z 복원 확인 |
| 0-2 | ✔ "메모 수정이 안 됨 — 미해결일 때만 수정 + 이력 패널에 본인 메모 수정 버튼" | 수정 기능 자체는 G-1 1단계 기구현 (open + 작성자 본인만, resolved 불변). 보완 구현 (2026-07-07): 메모 이력 패널에 본인+미해결 메모 한정 ✏️ 수정 버튼 추가 — 클릭 시 기존 메모 모달 edit 모드 재사용 (권한 검증 동일 경로). 라이브 검증 완료 | 이력 패널 → 본인 미해결 메모 → ✏️ 수정 |
| 0-3 | 🚚 "드래그 멀티셀렉트 성능 이슈 / 한 방향만 되는 것처럼 보임" | E-2 최적화: 동일 셀 mousemove 스킵 + 가상화 임계 150 + 스타일 오버레이 마커 (드래그 100이벤트 23ms). 엔진의 extend는 원래 대각선 사각형 지원 — "한 방향만"은 성능 지연이 만든 착시로 추정 | 대각선 드래그로 사각형 선택 확인; 여전히 재현되면 별도 추적 |
| 0-4 | 🚚 (부분) "수식 편집 팝업/툴팁에 ID 대신 컬럼명" | R1 표시 치환은 팝업 수식 입력창에는 적용됨. 단, 참조 확인 패널·헤더 ƒ 툴팁 등 일부 표면은 canonical 노출 가능성 있음 → 배포 후 남는 표면만 C-2 잔여로 처리 (아래 3-4) | 수식 열 헤더 hover 툴팁 + 팝업 하단 참조 확인 패널 |
1. 버그 (원인 특정)
| # | 상태 | 피드백 | 원인 → 수정 | 난이도 |
|---|
| 1-1 | ✔ | STG 엑셀 다운로드 실패 — Worksheet name already exists | 수정 완료 (2026-07-07): ExcelJS 전환의 회귀 — SheetJS는 중복 탭 이름 허용, ExcelJS는 throw. exportXlsx에 탭 이름 dedupe 추가: 중복 시 (2), (3) 접미사 (대소문자 무시 추적, 31자 한도 내 재절단). 라이브 검증: 중복 이름 4쌍 있는 기간 내보내기 성공 + 접미사 확인 | 완료 |
| 1-2 | ✔ | Ctrl+V 시 사이드바 깜빡임 (가끔) | 원인 확정 + 수정 완료 (2026-07-07): 개별 호출이 아니라 구조 문제 — 사이드바 폴더 트리가 x-if="!loadingSheets && …"로 감싸져 있어 어떤 경로든 full loadSheets가 돌면 트리 DOM이 파괴→재생성됨 ("가끔" = paste 자체는 silent지만 다른 흐름의 loadSheets와 겹칠 때). 수정: x-if 조건에서 !loadingSheets 제거 — 리로드 중에도 트리 유지, 시트 교체는 :key(id) 기반 제자리 morph. 스켈레톤은 목록이 빈 최초 로드에서만. 라이브 검증: full loadSheets 후에도 트리 노드 동일성 유지 | 완료 |
2. 스타일 · 시각
| # | 상태 | 피드백 | 방향 | 난이도 |
|---|
| 2-1 | ✔ | 배경색 있는 행은 호버가 안 보임 | 완료 (2026-07-07): 호버를 background-image 반투명 오버레이로 — 행 전체 12% + 커서가 얹힌 셀 24% 이중 단계라 어떤 셀 색 위에서도 '지금 가리키는 셀'이 보인다 | 완료 |
| 2-2 | ✔ | 컬럼 그룹 헤더 오른쪽 border만 | 완료 (2026-07-07): 밴드 셀에 border-left 추가 — border-collapse라 인접 그룹과는 1px로 합쳐짐 | 완료 |
| 2-3 | ✔ | 헤더 셀에 배경색/글자색 | 완료 (2026-07-07): columnLayout.headerStyle { color, bgColor } (core 스키마+엔티티+양쪽 레이아웃 projection) — 헤더 우클릭 → 🎨 헤더 배경색/🖋 글자색 스와치(셀 프리셋 12색 재사용, ✕ 기본). th 렌더 + XLSX 헤더 반영 + col-header-style undo. 라이브 검증 (적용→저장→Ctrl+Z 원복) | 완료 |
| 2-4 | ✔ | 헤더 한 번 클릭 = 열 전체 선택 | 완료 (2026-07-07): engine.selectColumn — 헤더 클릭 시 그 열 전체(1000행 확인)가 선택되어 기존 서식 툴바로 열 전체 글자/배경색 적용 가능. 우선순위: 수식 편집 중엔 참조 삽입 > 이름 변경 중엔 무시 > 일반 클릭 열 선택. 더블클릭(이름 변경/수식)과 공존 | 완료 |
| 2-5 | ✔ | 테두리 굵기/선 모양 | 완료 (2026-07-07): 테두리 팝오버에 직접 지정 섹션 — 변(위/아래/전체) × 굵기(1/2/3px) × 모양(실선/이중선/점선) + 라이브 미리보기. cellStyleSchema.border가 6종 프리셋 문자열 ∪ {side, width, style} 구조체 union (하위호환 유지). 렌더·XLSX 매핑(1→thin, 2→medium, 3→thick, double/dashed) 반영. 라이브 검증 (3px dashed 저장+렌더) | 완료 |
3. 수식
| # | 상태 | 피드백 | 방향 | 난이도 |
|---|
| 3-1 | ✔ | =SUM([a]:[b]) 범위 문법 | 완료 (2026-07-07): expandColumnRanges — 평가 직전에 [a]:[b]를 columnLayout 순서상 사이 열 전부로 전개 (역순 허용, 미해석 끝점은 그대로 → ⚠ 패널). canonical에 범위 그대로 저장되므로 사이에 열을 삽입하면 자동 포함. 크로스시트/상수/@행 참조는 제외. 3개 평가 지점(열 수식·셀 수식·R4) 공통. 단위 5종 + 라이브 E2E(SUM 30) | 완료 |
| 3-2 | ✔ | DAY(EOMONTH([date], 0)) 월 일수 | 완료 (2026-07-07): EOMONTH(date, offset) 추가 (DAY/MONTH/YEAR는 기존재) — UTC day-number 체계라 시간대 무관. 팝업 함수 카탈로그에 DAY/MONTH/YEAR/EOMONTH 노출 + SUM 도움말에 범위 문법 안내. 단위 3종 (28일/31일/오프셋/일할 원문 수식) | 완료 |
| 3-3 | ✔ | = 입력 = 열 수식 빠른 경로 | 완료 (2026-07-07): 셀에 = 입력 시 그 열 헤더 하이라이트(주황 링) + 셀 아래 안내 배지 "Enter → 열 전체 수식 적용 · Shift+Enter → 이 셀에만". Enter = 열 수식(kind=formula 승격 + 즉시 저장 + col-config undo + 토스트), Shift+Enter = 셀 수식(기존 R3). 자동 셀 수식 폴백: 행 고정 참조(@) 포함 시 / 이미 수식 열인 경우. 라이브 E2E (하이라이트·배지·Enter 적용·undo 복원) | 완료 |
| 3-4 | ✔ | 수식 팝업·툴팁에 ID 대신 컬럼명 | 완료 (2026-07-07): displayFormula() 헬퍼 — 헤더 ƒ 툴팁 + 🔍 참조 확인 패널 칩이 표시형(라벨) 노출 ([col_1]+[col_2] → [A]+[B], hover 시 canonical은 title로). 모호 토큰은 R1 원칙대로 canonical 유지 | 완료 |
| 3-5 | ✔ | 수식 복사/붙여넣기 | 완료 (2026-07-07): 복사 시 선택 안의 셀 수식(canonical)을 상대 좌표로 사이드채널 캡처 — 같은 시트에 같은 TSV가 붙여넣어지면 해당 위치에 수식 복원 (kind=formula, 열 참조는 행 상대 의미 유지 — 라이브 E2E: [col_1]*3 복사→다른 행 7×3=21). @행 고정 참조는 절대 참조로 그대로. 외부 앱/다른 시트 붙여넣기는 값 유지. 토스트 "수식 N개 복원됨". 부수 수정: 수식 열 복사 TSV가 빈 값이던 문제 → 평가값 폴백 (외부 앱에도 값이 감) | 완료 |
4. 사이드바 · 폴더
| # | 상태 | 피드백 | 방향 | 난이도 |
|---|
| 4-1 | ✔ | 폴더 접으면 선택 시트 위치 모름 | 완료 (2026-07-07): 접힌 폴더에 활성 시트가 있으면 주황 텍스트 + 좌측 액센트 바 + 옅은 배경 (펼치면 시트 자체가 강조되므로 접힘 상태에서만) | 완료 |
| 4-2 | ✔ | 폴더 이름 잘림 — 툴팁 + 너비 조절 | 완료 (2026-07-07): ① 폴더 라벨 :title 툴팁 ② 사이드바 우측 경계 드래그 리사이즈 (160~480px 클램프, 사용자별 localStorage 기억, 핸들 호버 하이라이트). 라이브 검증 (224→304px 드래그+저장) | 완료 |
| 4-3 | ✔ | 폴더 DnD drop 판정이 타이틀에만 | 완료 (2026-07-07): 원인 — 시트 아이템의 drop 핸들러가 draggingSheetId를 소비해 부모 폴더 핸들러가 no-op. 수정: 다른 폴더의 시트 위에 놓아도 그 시트의 폴더로 이동(groupId 갱신) + 순서 재배치 병행. 라이브 검증 완료 | 완료 |
| 4-4 | ✔ | 새 시트 생성 시 사이드바 전체 리로드 깜빡임 | 1-2 수정으로 함께 해소 (2026-07-07): 트리가 리로드 중 언마운트되지 않으므로 생성 후 loadSheets가 돌아도 새 항목만 keyed morph로 추가됨 — Finder식 동작이 구조적으로 달성. 별도 제자리 삽입 불필요 | 완료 |
5. 병합 · 데이터 입력
| # | 상태 | 피드백 | 방향 | 난이도 |
|---|
| 5-1 | ✔ | 수식 있는 셀도 병합 | 완료 (2026-07-07, 확정 의미론): 블록에 수식이 있으면 값 통일 대신 좌상단 첫 수식으로 수식 통일 — 값 셀과 달리 수식은 값 통일이 없고, 각 행이 자기 행 값으로 평가되어 블록 내부 값이 분기한다 (표시는 앵커 값). 라이브 E2E: [col_1]*2 포함 3행 병합 → 세 행 모두 같은 수식·값은 20/40/60 분기, undo로 셀 수식/리터럴/빈 값 각각 원복. 재동기화(앵커 수식 편집·붙여넣기)도 수식 블록이면 수식을 동기화. 검증 완화: 수식 열 병합 허용 (식별/집계는 계속 거부) | |
| 5-2 | ✔ | 직원 추가 위치 (요구사항 확정 2026-07-07) | 완료: 삽입 메뉴를 행 ▶ / 열 ▶ 플라이아웃으로 재구성 — 행: 위/아래 1개 삽입 · 📅 날짜로 행 추가 · 👤 직원으로 행 추가 · 하단 여러 개; 열: 왼쪽/오른쪽 · 여러 개 · ƒ/☑/▾. 직원/날짜 항목은 선택 셀 상태 기반 조건부 활성화(식별 열/날짜 열 존재 + 셀 선택 — 아니면 비활성 표시+사유 툴팁). 동작: 선택 위치 바로 아래에 행 생성(최하단 아님) + 스크롤 + 채우기 픽커 자동 오픈(시트 기반별 자동 분기 — 직원 자동완성/날짜 픽커/자유). 라이브 검증 | |
| 5-3 | ✔ | 참조(레코드) 설정 (요구사항 확정 2026-07-07) | 완료: ① 명칭 "참조 (레코드)" → "시스템 기록", 안내 문구 → "시스템에 기록된 정보" ② 소스 테이블 선택 전엔 참조할 필드 비활성화(안내 문구 표시) ③ 테이블 선택 시 그 테이블의 필드만 표시 — 14개 테이블별 필드 카탈로그(REF_FIELD_CATALOG) 데이터 주도, 종전 전 테이블 통합 목록 제거. 라이브 검증 (overtime→6+공통, ward→5필드) | |
6. 반영 안 함
| # | 피드백 | 사유 |
|---|
| 6-1 | ❌ 행 기준 수식 정리 | 원문 취소선 — C-1 셀 수식으로 충족 (1차 C-3 판정과 동일) |
권장 순서
즉시 (버그·배포 확인)
1-1 엑셀 내보내기 수정 ✔ 완료- PR #405 STG 배포 → 0-1~0-4 재확인 (4건이 해소될 가능성)
1-2 Ctrl+V 깜빡임 ✔ 완료 (4-4 함께 해소)
빠른 승리 (스타일·사이드바 소형) 4. 2-1 · 2-2 · 4-1 · 4-3 · 3-4 · 4-2 ✔ 전부 완료 (2026-07-07)
중형 (설계 포함) 6. 2-4 헤더 클릭 열 선택 · 2-3 헤더 셀 스타일 ✔ 완료 (2026-07-07) 7. 3-1 SUM 범위 · 3-2 EOMONTH/DAY · 3-3 = 열 수식 UX ✔ 완료 (2026-07-07) 8. 2-5 테두리 확장 · 3-5 수식 복붙 · 5-1 수식 셀 병합 ✔ 전부 완료 (2026-07-07)
r2 24건 전체 종결 (2026-07-07) — 0-1~0-4는 PR #405에 구현 완료된 항목으로 STG 재확인 생략(사용자 결정). 배포되면 자동 해소.
부록. 이후 단건 QA (r2 이후 접수)
| # | 상태 | 피드백 | 방향 | 완료일 |
|---|
| A-1 | ✔ | [연장근무 내역 전체] 동일 내역이 연달아 2번씩 표시 | 원인: 시트 자동 행은 두 경로로 만들어진다 — ① 시트 단위 autoPopulate 룰(runAutoPopulate, 레거시 FK sourceOvertimeRecordId 링크) ② 컬럼 단위 소스 바인딩(materializeSheet, generic sourceTable+sourceRecordId 링크). 두 reconciler가 서로의 링크 방식 행을 인지하지 못해, 룰이 있는 시트에 소스 바인딩 컬럼이 하나라도 생기면(컬럼 편집기에서 소스 테이블 선택 시) 같은 레코드가 FK 행 + generic 행으로 정확히 2번씩 삽입되고, 각자 자기 행만 관리하므로 영구 지속. 유니크 인덱스는 컬럼이 달라 못 막음. 로컬 재현 성공(바인딩 추가 → worker 틱에서 즉시 2배). 수정: ⓐ runAutoPopulate가 두 링크 방식을 모두 existing으로 집계(이중 삽입 차단) + 같은 레코드의 중복 행 자기치유(셀 있는 행 > FK 행 > 오래된 행 순으로 1개만 남기고 soft-delete — 시트 열람 시 자동 정리) ⓑ materializeSheet도 FK 행을 "이미 존재"로 집계, 삭제는 generic 행만 담당(룰 필터와의 플랩 방지) ⓒ 같은 소스에 룰+바인딩이 공존하면 wanted를 합집합으로 계산(worker가 autoPopulate를 함께 로드). STG의 기존 중복 데이터는 배포 후 시트를 열면 자기치유로 자동 정리됨 | 2026-07-31 |