fix: 로그인 새로고침 에러

src/components/common/Header.tsx

@@ -4,7 +4,7 @@ import React, { useState, useEffect } from 'react'
 import dynamic from 'next/dynamic'
 import Image from 'next/image'
 import { useToast } from '@/hooks/useToast'
-import { useRecoilValueLoadable } from 'recoil'
+import { useRecoilValue } from 'recoil'
 import { userInfoState } from '@/recoil/UserInfo'
 import { useRouter, usePathname } from 'next/navigation'
 import Button from './Button'
@@ -22,22 +22,16 @@ const Header = () => {
   const pathname = usePathname()
   const router = useRouter()
   const [selected, setSelected] = useState<string | null>(null)
-  const userInfoLoadable = useRecoilValueLoadable(userInfoState)
-  const { state, contents: userInfo } = userInfoLoadable
+  const userInfo = useRecoilValue(userInfoState)
   const { showToast } = useToast()
+  console.log('userInfo:', userInfo)
 
   useEffect(() => {
     if (pathname) {
       setSelected(pathname)
     }
   }, [pathname])
 
-  useEffect(() => {
-    if (state === 'hasValue' && userInfo) {
-      // 사용자 정보가 로드된 후에 헤더를 다시 렌더링
-    }
-  }, [state, userInfo])
-
   const handleCategoryClick = (path: string) => {
     if (!userInfo) {
       showToast('로그인이 필요한 서비스입니다')
@@ -52,10 +46,6 @@ const Header = () => {
     router.push(path)
   }
 
-  if (state === 'loading') {
-    return <div>로딩 중...</div>
-  }
-
   return (
     <>
       <header className="fixed top-0 left-0 w-full bg-white z-50 shadow-custom-light px-5 sm:px-7% md:px-10%">
@@ -73,15 +63,15 @@ const Header = () => {
             onClick={() => router.push('/')}
             className="cursor-pointer"
           />
-          {!userInfo ? (
+          {userInfo !== null ? (
+            <Profile user={userInfo} />
+          ) : (
             <Button
               text="로그인하고 이용하기"
               color="PURPLE"
               size="medium"
               onClick={() => router.push('/signin')}
             />
-          ) : (
-            <Profile user={userInfo} />
           )}
         </div>