기본값을 뒤집은 날

포커스 슬롯에 태스크를 넣었다 뺐다 할 때마다 주변 태스크들이 부드럽게 밀려 올라갔다 내려왔다 하는 게 거슬렸다. 목록이 “숨쉬는” 느낌을 주려고 처음에 layout에 LinearTransition을 붙였는데, 시간이 지나면서 포커스 전환의 주인공은 대상 태스크 자체라 주변이 같이 움직이면 오히려 주의가 분산됐다.

첫 시도: 전환 중에만 끄기

당연한 접근부터 시작했다. 포커스/언포커스가 발생하면 600ms 동안 애니메이션을 끄는 ref 하나를 도입했다. 결과는 깔끔했다. 포커스 대상의 entering 애니메이션은 살아있고, 주변은 snap. 만족스러웠다.

같은 패턴을 또 원함

그런데 생성 순간에도 똑같이 하고 싶어졌다. 새 태스크가 리스트에 들어올 때 주변이 흔들리는 게 마찬가지로 거슬렸기 때문이다. 그래서 같은 ref를 생성 이벤트에도 연결했다. 이름도 focusTransitionActiveRef → itemTransitionActiveRef로 generalize.

이상한 느낌

여기서 멈추고 보니 뭔가 이상했다. layout 애니메이션을 언제 원하는가를 적어봤다.

• 포커스 전환 → 끄기
• 생성 → 끄기
• (아마도) 수정 → 끄기
• 삭제 → 끄기
• 정렬 변경 → 끄기?

“언제 켜고 싶은가”에 답이 잘 안 나왔다. 평소에 이 애니메이션이 없어도 나쁘지 않았다.

기본값을 뒤집기

그래서 단순히 방향을 뒤집었다. layout을 기본 undefined로. itemTransitionActiveRef, collapsingRef, 관련 useEffect, toggleCollapse의 ref 조작 — 전부 제거. 41줄이 3줄이 됐다.

남긴 애니메이션

• 변경이 있는 대상 본인의 entering (shouldExpand가 true일 때 — justUnfocused / justCreated / justModified)
• 포커스 슬롯 자체의 scale-in/out
• 아이템 내부 미시 애니메이션 (별 dance, tint pulse 등)

규칙

변경이 있는 애들만 animate, 나머지는 snap.

한 줄로 요약되고, 예외 없이 적용된다.

돌아보며

처음부터 기본값을 고민했으면 더 빨리 왔을 텐데, “일단 기본은 유지하고 예외적으로 끄자”가 너무 자연스러운 출발점이라 거기서 출발했다. 예외가 하나씩 쌓여서 보편적이 되는 순간, 그건 더 이상 예외가 아니라 기본값을 다시 생각해야 한다는 신호였다.