diff --git a/packages/client/src/components/layout/nav.tsx b/packages/client/src/components/layout/nav.tsx index 9e2fe1d..1b32e12 100644 --- a/packages/client/src/components/layout/nav.tsx +++ b/packages/client/src/components/layout/nav.tsx @@ -65,43 +65,13 @@ function useNavItemsData() { bottomNav: (useCustomItems: boolean) => useCustomItems ? [] : [ createNavItem("tags", "Tags"), createNavItem("difference", "Diff"), - { ...accountItem, name: isLoggedIn ? "Profile" : "Login" }, + accountItem, createNavItem("settings", "Settings") ] }) }, [isLoggedIn]); } -export function NavList() { - const customNavItems = useNavItems(); - const { main, footer } = useNavItemsData(); - - return ( - - ); -} - // 사이드바 토글 버튼 export function SidebarToggle({ className, @@ -127,20 +97,6 @@ export function SidebarToggle({ ); } -// 모바일용 사이드바 토글 버튼 -export function MobileSidebarToggle() { - const [sidebarState, setSidebarState] = useAtom(sidebarAtom); - const isOpen = sidebarState.isCollapsed; - const onToggle = () => setSidebarState((s) => ({ ...s, isCollapsed: !s.isCollapsed })); - - return ( - - ); -} - // 사이드바 네비게이션 아이템 interface SidebarNavItemProps { children: React.ReactNode; diff --git a/packages/client/src/state/user.ts b/packages/client/src/state/user.ts index 1c13051..62a3871 100644 --- a/packages/client/src/state/user.ts +++ b/packages/client/src/state/user.ts @@ -135,16 +135,29 @@ export const doResetPassword = async (username: string, oldpassword: string, new } }; +let imutableSnapshot: ReturnType = getUserSessions(); +const getSnapshot = () => { + const snap = getUserSessions(); + // to avoid infinite loop, do not update the snapshot if it hasn't changed + if (JSON.stringify(snap) === JSON.stringify(imutableSnapshot)) { + return imutableSnapshot; + } + return snap; +} +const subscribe = (onChange: () => void) => { + console.log("Auth hook subscribed"); + const listener = () => { + console.log("Auth state changed, updating hook"); + imutableSnapshot = getSnapshot(); + onChange(); + }; + window.addEventListener("auth", listener); + return () => window.removeEventListener("auth", listener); +} export function useLogin() { const hook = useSyncExternalStore( - (onChange) => { - const listener = () => { - onChange(); - }; - window.addEventListener("auth", listener); - return () => window.removeEventListener("auth", listener); - }, + subscribe, getUserSessions, ); return hook;