fix: Add Sync SessionStore at userSession

세션 스토어와 유저 세션을 동기화 하는 로직추가 / layout 컴포넌트 코드 수정
This commit is contained in:
yoosangwook 2024-09-26 14:58:32 +09:00
parent 14faacf985
commit e9009ffdd5
2 changed files with 41 additions and 7 deletions

View File

@ -31,6 +31,28 @@ export default async function RootLayout({ children }) {
// const isLoggedIn = await checkSession()
const session = await getSession()
console.log('session[layout]:', session)
let sessionProps = {}
if (session.isLoggedIn) {
sessionProps = {
userId: session.userId,
saleStoreId: session.saleStoreId,
name: session.name,
mail: session.mail,
tel: session.tel,
storeId: session.storeId,
userNm: session.userNm,
userNmKana: session.userNmKana,
category: session.category,
telNo: session.telNo,
fax: session.fax,
email: session.email,
pwdInitYn: session.pwdInitYn,
isLoggedIn: session.isLoggedIn,
}
}
if (!headerPathname.includes('/login') && !session.isLoggedIn) {
redirect('/login')
}
@ -41,7 +63,7 @@ export default async function RootLayout({ children }) {
<body>
{/*{headerPathname !== '/login' && <Headers />}*/}
<div className="wrap">
<Header loginedUserNm={session?.userNm} />
<Header userSession={sessionProps} />
<UIProvider>
<div className="content">
<Dimmed />

View File

@ -1,13 +1,16 @@
'use client'
import { Fragment, useState } from 'react'
import { Fragment, useCallback, useEffect, useState } from 'react'
import Link from 'next/link'
import { usePathname, useRouter } from 'next/navigation'
import { usePathname } from 'next/navigation'
import { useRecoilState, useRecoilValue } from 'recoil'
import { dimmedStore, sessionStore } from '@/store/commonAtom'
import { useMessage } from '@/hooks/useMessage'
import { logout } from '@/lib/authActions'
import QSelectBox from '@/components/common/select/QSelectBox'
import { useRecoilValue } from 'recoil'
import { dimmedStore } from '@/store/commonAtom'
export const ToggleonMouse = (e, act, target) => {
const listWrap = e.target.closest(target)
@ -25,7 +28,8 @@ export const ToggleonMouse = (e, act, target) => {
}
export default function Header(props) {
const { loginedUserNm } = props
const { userSession } = props
const [sessionState, setSessionState] = useRecoilState(sessionStore)
const { getMessage } = useMessage()
const pathName = usePathname()
// if (pathName.includes('login') || pathName.includes('join')) {
@ -65,6 +69,14 @@ export default function Header(props) {
},
]
const syncSession = useCallback(() => {
setSessionState({ ...userSession })
})
useEffect(() => {
syncSession()
}, [userSession])
const onChangeSelect = (option) => {
setSelected(option)
}
@ -125,7 +137,7 @@ export default function Header(props) {
</div>
<div className="header-left">
<div className="profile-box">
<button className="profile">{loginedUserNm}</button>
<button className="profile">{userSession.userNm}</button>
</div>
<div className="sign-out-box">
<button className="sign-out" onClick={() => logout()}>