페이지 전환·새로고침 시 사이드바 펼침 상태가 사라지는 문제

[sujin0530]

문제

사이드바에서 팀을 펼쳐 폴더를 둘러보다가, 잠깐 다른 페이지에 다녀오면 펼쳐 두었던 팀들이 전부 다시 접혀 있습니다. 새로고침해도 마찬가지입니다. Notion이나 VS Code의 사이드바는 트리 상태를 그대로 유지해 주는데, 우리는 페이지를 옮길 때마다 사용자가 처음부터 다시 펼쳐야 합니다.

원인

Sidebar.tsx에서 펼침 상태를 관리하는 manualExpandedTeams가 컴포넌트 로컬 useState로만 선언되어 있음

const [manualExpandedTeams, setManualExpandedTeams] = useState<
  Record<string, boolean>
>({});

이 구조이다 보니 Sidebar 컴포넌트가 unmount되거나 페이지를 새로고침하면 상태가 통째로 사라짐
(->페이지를 옮길 때마다 사용자가 펼쳐 두었던 트리가 초기화되는 원인)

필요한 것

페이지 전환과 새로고침에도 살아남는, 영속 가능한 클라이언트 UI 상태 관리가 필요