Refactor session code

기다리다 내가 먼저 푸시 한다
This commit is contained in:
yoosangwook 2024-09-12 15:39:55 +09:00
parent c024a893cd
commit 810b8b3b64
5 changed files with 27 additions and 65 deletions

View File

@ -1,21 +1,19 @@
import { getSession } from '@/lib/authActions' import { getSession } from '@/lib/authActions'
import { getCurrentLocale } from '@/locales/server' // import { getCurrentLocale } from '@/locales/server'
import MainPage from '@/components/Main' import MainPage from '@/components/Main'
export default async function page() { export default async function page() {
const session = await getSession() const session = await getSession()
const currentLocale = getCurrentLocale() // const currentLocale = getCurrentLocale()
const mainPageProps = { const mainPageProps = {
currentLocale,
isLoggedIn: session?.isLoggedIn, isLoggedIn: session?.isLoggedIn,
} }
return ( return (
<> <>
<div className="m-4"> <div className="m-4">
<h3>Main</h3>
<MainPage {...mainPageProps} /> <MainPage {...mainPageProps} />
</div> </div>
</> </>

View File

@ -1,15 +1,17 @@
import { Inter } from 'next/font/google' import { Inter } from 'next/font/google'
import { checkSession, getSession } from '@/lib/authActions'
import RecoilRootWrapper from './RecoilWrapper' import RecoilRootWrapper from './RecoilWrapper'
import UIProvider from './UIProvider' import UIProvider from './UIProvider'
import { ToastContainer } from 'react-toastify' import { ToastContainer } from 'react-toastify'
import './globals.css'
import '../styles/style.scss'
import Header from '@/components/header/Header' import Header from '@/components/header/Header'
import QModal from '@/components/common/modal/QModal' import QModal from '@/components/common/modal/QModal'
import './globals.css'
import '../styles/style.scss'
const inter = Inter({ subsets: ['latin'] }) const inter = Inter({ subsets: ['latin'] })
export const metadata = { export const metadata = {
@ -17,14 +19,18 @@ export const metadata = {
description: 'Generated by create next app', description: 'Generated by create next app',
} }
export default function RootLayout({ children }) { export default async function RootLayout({ children }) {
await checkSession()
const session = await getSession()
console.log('session[layout]:', session)
return ( return (
<html lang="en"> <html lang="en">
<body className={inter.className}> <body className={inter.className}>
{/*{headerPathname !== '/login' && <Headers />}*/} {/*{headerPathname !== '/login' && <Headers />}*/}
<RecoilRootWrapper> <RecoilRootWrapper>
<div className="wrap"> <div className="wrap">
<Header /> <Header loginedUserNm={session.userNm} />
<div className="content"> <div className="content">
<UIProvider>{children}</UIProvider> <UIProvider>{children}</UIProvider>
</div> </div>

View File

@ -1,62 +1,9 @@
'use client' 'use client'
import { logout } from '@/lib/authActions'
import { useChangeLocale, useI18n } from '@/locales/client'
import { Button, Chip } from '@nextui-org/react'
import Link from 'next/link'
export default function MainPage(props) { export default function MainPage(props) {
const { currentLocale, isLoggedIn } = props
const t = useI18n()
const changeLocale = useChangeLocale()
const handleChangeLocale = () => {
currentLocale === 'ja' ? changeLocale('ko') : changeLocale('ja')
}
// console.log('MainPage', currentLocale)
const handleLogout = async () => {
await logout()
}
return ( return (
<> <>
<h3>{t('locale', { locale: <Chip color="primary">{currentLocale}</Chip> })}</h3> <h1>Main page</h1>
<div>{t('hello')}</div>
<div>{t('welcome', { name: '효준' })}</div>
<div>
<Button onClick={handleChangeLocale}>Change Locale</Button>
</div>
{isLoggedIn && (
<div className="my-4">
<Button color="primary" onClick={handleLogout}>
로그아웃
</Button>
</div>
)}
{!isLoggedIn && (
<div className="my-4">
<Link href={'/' + currentLocale + '/login'}>
<Button color="primary">로그인 페이지로 이동</Button>
</Link>
</div>
)}
<div className="font-test">font-test</div>
{/*<h3>{t('locale', { locale: <Chip color="primary">{currentLocale}</Chip> })}</h3>*/}
{/*<div>{t('hello')}</div>*/}
{/*<div>{t('welcome', { name: '효준' })}</div>*/}
{/*<div>*/}
{/* <Button onClick={handleChangeLocale}>Change Locale</Button>*/}
{/*</div>*/}
{/*{isLoggedIn && (*/}
{/* <div className="my-4">*/}
{/* <Button color="primary" onClick={handleLogout}>*/}
{/* 로그아웃*/}
{/* </Button>*/}
{/* </div>*/}
{/*)}*/}
{/*<div className="font-test">font-test</div>*/}
</> </>
) )
} }

View File

@ -1,8 +1,9 @@
'use client' 'use client'
import Link from 'next/link' import Link from 'next/link'
import QSelectBox from '@/components/common/select/QSelectBox'
import { usePathname } from 'next/navigation' import { usePathname } from 'next/navigation'
import { useMessage } from '@/hooks/useMessage' import { useMessage } from '@/hooks/useMessage'
import QSelectBox from '@/components/common/select/QSelectBox'
import { getSession } from '@/lib/authActions'
export const ToggleonMouse = (e, act, target) => { export const ToggleonMouse = (e, act, target) => {
const listWrap = e.target.closest(target) const listWrap = e.target.closest(target)
@ -19,7 +20,9 @@ export const ToggleonMouse = (e, act, target) => {
} }
} }
export default function Header() { export default function Header(props) {
const { loginedUserNm } = props
// console.log('loginedUserNm:', loginedUserNm)
const { getMessage } = useMessage() const { getMessage } = useMessage()
const pathName = usePathname() const pathName = usePathname()
if (pathName.includes('login') || pathName.includes('join')) { if (pathName.includes('login') || pathName.includes('join')) {
@ -101,7 +104,7 @@ export default function Header() {
</div> </div>
<div className="header-left"> <div className="header-left">
<div className="profile-box"> <div className="profile-box">
<button className="profile">Kim Ji Young</button> <button className="profile">{loginedUserNm}</button>
</div> </div>
<div className="sign-out-box"> <div className="sign-out-box">
<button className="sign-out">{getMessage('header.logout')}</button> <button className="sign-out">{getMessage('header.logout')}</button>

View File

@ -27,6 +27,14 @@ export async function getSession() {
return session return session
} }
export async function checkSession() {
const session = await getSession()
if (!session.isLoggedIn) {
redirect('/login')
}
}
export async function setSession(data) { export async function setSession(data) {
const session = await getSession() const session = await getSession()