'use client'

import { logout } from '@/lib/authActions'
import { useChangeLocale, useI18n } from '@/locales/client'
import { Button, Chip } from '@nextui-org/react'

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 (
    <>
      <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>
    </>
  )
}