Merge branch 'develop' into fix/94

src/app/(home)/_components/CreateBoardBtn.tsx

@@ -27,7 +27,7 @@ const CreateBoardBtn = () => {
         className="mb-3 shadow-[0px_0px_20px_0px_rgba(255,255,255,0.6)]"
         onClick={handleClick}
       >
-        시작하기
+        보드 만들기
       </Button>
       <GoToLoginModal
         isOpen={loginModalOpen}

src/app/(onboarding)/login/page.tsx

@@ -22,8 +22,8 @@ const LoginPage = () => {
         className="object-contain px-20 pb-10"
       />
       <div className="flex w-full flex-col items-center pb-[97px]">
-        <div className="pb-2 text-center text-sm">
-          지금 폴라보와 함께 추억을 담아보세요!
+        <div className="pb-2 text-center text-xs">
+          지금 폴라보와 함께 추억을 공유해보세요!
         </div>
         <KakaoLogin />
         <Policy />

src/app/(onboarding)/signup/_components/contexts/ProfileContext.tsx

@@ -9,15 +9,16 @@ import {
   useContext,
   useMemo,
   useState,
+  useEffect,
 } from 'react'
 
 interface ProfileContextProps {
   newName: UserProfile['nickName']
   newBirthDt: UserProfile['birthDt']
   newGender: UserProfile['gender']
   setNewName: Dispatch<SetStateAction<UserProfile['nickName']>>
-  setBirthDt: Dispatch<SetStateAction<UserProfile['birthDt']>>
-  setGender: Dispatch<SetStateAction<UserProfile['gender']>>
+  setNewBirthDt: Dispatch<SetStateAction<UserProfile['birthDt']>>
+  setNewGender: Dispatch<SetStateAction<UserProfile['gender']>>
 }
 
 const ProfileContext = createContext<ProfileContextProps | undefined>(undefined)
@@ -28,20 +29,24 @@ export const ProfileProvider = ({
   children: React.ReactNode
 }) => {
   const { data: session } = useSession()
-  const [newName, setNewName] = useState<UserProfile['nickName']>(
-    session?.profile.nickName ?? '',
-  )
-  const [newBirthDt, setBirthDt] = useState<UserProfile['birthDt']>(undefined)
-  const [newGender, setGender] = useState<UserProfile['gender']>('NONE')
+  const [newName, setNewName] = useState<UserProfile['nickName']>('')
+  const [newBirthDt, setNewBirthDt] =
+    useState<UserProfile['birthDt']>(undefined)
+  const [newGender, setNewGender] = useState<UserProfile['gender']>('NONE')
+
+  useEffect(() => {
+    setNewName(session?.profile.nickName ?? '')
+    setNewBirthDt(session?.profile.birthDt)
+  }, [session])
 
   const value = useMemo(
     () => ({
       newName,
       newBirthDt,
       newGender,
       setNewName,
-      setBirthDt,
-      setGender,
+      setNewBirthDt,
+      setNewGender,
     }),
     [newName, newBirthDt, newGender],
   )

src/app/(onboarding)/signup/_components/steps/BirthDtForm.tsx

@@ -12,18 +12,19 @@ const BirthDtForm = ({
 }: {
   handleSubmit: (profile: UserProfile) => Promise<boolean>
 }) => {
-  const { newName, newBirthDt, setBirthDt, newGender } = useProfile()
+  const { newName, newBirthDt, setNewBirthDt, newGender } = useProfile()
   const { nextStep } = useStep()
   const [hasError, setHasError] = useState(false)
   const [modalOpen, setModalOpen] = useState(false)
 
   const onSubmit = async () => {
     if (newBirthDt) {
-      if (validateBirthDt(newBirthDt) === false) {
+      if (!validateBirthDt(newBirthDt)) {
         setModalOpen(true)
         return
       }
     }
+
     await handleSubmit({
       nickName: newName,
       birthDt: newBirthDt,
@@ -37,15 +38,16 @@ const BirthDtForm = ({
       <div className="flex flex-1 flex-col">
         <div className="mb-2 whitespace-pre-line text-2xl font-thin leading-10">
           <span className="font-regular">{newName}</span>
-          {'님의 \n 생일을 입력해주세요!'}
+          {'님의\n생일을 입력해주세요!'}
         </div>
         <p className="text-sm text-gray-400">
           추가 정보를 입력하시면 나에게 딱 맞는 보드 주제를 추천해드려요 :)
         </p>
 
         <div className="mx-auto mt-14">
           <BirthDateInput
-            setBirthDt={setBirthDt}
+            value={newBirthDt}
+            setBirthDt={setNewBirthDt}
             setHasError={setHasError}
             className="w-[300px] text-xl"
           />

src/app/(onboarding)/signup/_components/steps/NicknameForm.tsx

@@ -14,14 +14,12 @@ const NicknameForm = ({
   handleSubmit: (profile: UserProfile) => Promise<boolean>
 }) => {
   const { newName, setNewName, newBirthDt, newGender } = useProfile()
-  const [nickname, setNickname] = useState('')
   const [hasError, setHasError] = useState(false)
-  const isEmpty = nickname.length === 0
+  const isEmpty = newName.length === 0
 
   const { nextStep } = useStep()
 
   const createNickname = async () => {
-    setNewName(nickname)
     await handleSubmit({
       nickName: newName,
       birthDt: newBirthDt,
@@ -37,8 +35,8 @@ const NicknameForm = ({
       </div>
       <div className="">
         <NicknameInput
-          value={nickname}
-          setValue={setNickname}
+          value={newName}
+          setValue={setNewName}
           setHasError={setHasError}
           icon={<SketchIcon />}
         />

src/app/(onboarding)/signup/page.tsx

@@ -8,7 +8,7 @@ const SignUpPage = async () => {
   const session = await auth()
 
   if (session && !session.newUser) {
-    redirect('/board/create')
+    redirect('/')
   }
   return (
     <div className="flex h-dvh flex-col items-center justify-between">

src/app/mypage/boards/components/BoardList/BoardItem.tsx → src/app/mypage/boards/_components/BoardList/BoardItem.tsx

@@ -1,7 +1,7 @@
 import EllipsisIcon from 'public/icons/ellipsis.svg'
-import BoardEditPopup from '@/app/mypage/boards/components/BoardEditPopup'
 import React, { useState } from 'react'
-import DeleteBoardModal from '@/app/mypage/boards/components/DeleteBoardModal'
+import DeleteBoardModal from './DeleteBoardModal'
+import BoardEditPopup from './BoardEditPopup'
 
 interface BoardListProps {
   title: string

src/app/mypage/boards/page.tsx

@@ -1,7 +1,7 @@
 import Header from '@/components/Header'
 import { getMyBoards } from '@/lib/api/myBoard'
-import EmptyBoardList from './components/EmptyBoardList'
-import BoardList from './components/BoardList'
+import EmptyBoardList from './_components/EmptyBoardList'
+import BoardList from './_components/BoardList'
 
 const Page = async () => {
   const { pagination } = await getMyBoards()

src/app/mypage/leave/page.tsx

@@ -6,7 +6,7 @@ const Page = () => {
   const leaveCheckTitle = '탈퇴전 꼭 확인해주세요.'
   const leaveReasonTitle = '탈퇴하려는 이유를 알려주세요.'
   const leaveDescription =
-    '계정을 삭제하면 복구가 불가능하며, 같은 계정으로\n재가입이 어려워요. 회원정보 및 보드가 모두\n삭제되며, 삭제된 데이터는 복구가 불가능해요.'
+    '계정을 삭제하면 복구가 불가능하며\n회원정보 및 보드가 모두 삭제돼요. \n또한, 삭제된 데이터는 복구가 불가능해요.'
 
   return (
     <div className="flex h-dvh flex-col bg-gray-50">

src/app/mypage/profileEdit/_components/ProfileForm.tsx

@@ -29,6 +29,14 @@ const ProfileForm = ({ children }: { children: ReactNode }) => {
   const [unChanged, setUnChanged] = useState(true)
   const [modalOpen, setModalOpen] = useState(false)
 
+  useEffect(() => {
+    if (session?.profile) {
+      setNewName(session?.profile.nickName)
+      setNewBirthDt(session?.profile.birthDt)
+      setNewGender(session?.profile.gender)
+    }
+  }, [session])
+
   useEffect(() => {
     if (
       session?.profile.nickName === newName &&
@@ -86,6 +94,7 @@ const ProfileForm = ({ children }: { children: ReactNode }) => {
           <div className="mb-[26px]">
             <Title>생년월일</Title>
             <BirthDateInput
+              value={newBirthDt}
               setBirthDt={setNewBirthDt}
               setHasError={setBirthError}
               className="border-b border-gray-950"

src/components/BirthDateInput/index.tsx

@@ -1,7 +1,6 @@
 'use client'
 
 import { UserProfile } from '@/types'
-import { useSession } from 'next-auth/react'
 import {
   ChangeEvent,
   Dispatch,
@@ -13,12 +12,14 @@ import {
 import { twMerge } from 'tailwind-merge'
 
 interface BirthDateInputProps {
+  value: UserProfile['birthDt']
   setBirthDt: Dispatch<SetStateAction<UserProfile['birthDt']>>
   setHasError: Dispatch<SetStateAction<boolean>>
   className?: React.ComponentProps<'div'>['className']
 }
 
 const BirthDateInput = ({
+  value,
   setBirthDt,
   setHasError,
   className = '',
@@ -30,16 +31,14 @@ const BirthDateInput = ({
   const monthInputRef = useRef<HTMLInputElement>(null)
   const dayInputRef = useRef<HTMLInputElement>(null)
 
-  const { data: session } = useSession()
-
   useEffect(() => {
-    if (!session || !session.profile.birthDt) return
+    if (!value) return
 
-    const [y, m, d] = session.profile.birthDt.split('-')
+    const [y, m, d] = value.split('-')
     setYear(y)
     setMonth(m)
     setDay(d)
-  }, [session])
+  }, [value])
 
   useEffect(() => {
     if (!year && !month && !day) {
@@ -55,31 +54,32 @@ const BirthDateInput = ({
   }, [year, month, day])
 
   const handleYearChange = (e: ChangeEvent<HTMLInputElement>) => {
-    const { value } = e.target
-    if (/^\d{0,4}$/.test(value)) {
-      setYear(value)
-      if (value.length === 4) {
+    const { value: inputValue } = e.target
+    if (/^\d{0,4}$/.test(inputValue)) {
+      setYear(inputValue)
+      if (inputValue.length === 4) {
         monthInputRef.current?.focus()
       }
     }
   }
 
   const handleMonthChange = (e: ChangeEvent<HTMLInputElement>) => {
-    const { value } = e.target
-    if (/^\d{0,2}$/.test(value) && +value <= 12) {
-      setMonth(value)
-      if (value.length === 2) {
+    const { value: inputValue } = e.target
+    if (/^\d{0,2}$/.test(inputValue) && +inputValue <= 12) {
+      setMonth(inputValue)
+      if (inputValue.length === 2) {
         dayInputRef.current?.focus()
       }
     }
   }
 
   const handleDayChange = (e: ChangeEvent<HTMLInputElement>) => {
-    const { value } = e.target
-    if (/^\d{0,2}$/.test(value) && +value <= 31) {
-      setDay(value)
+    const { value: inputValue } = e.target
+    if (/^\d{0,2}$/.test(inputValue) && +inputValue <= 31) {
+      setDay(inputValue)
     }
   }
+
   return (
     <div
       className={twMerge(

src/components/TextInput/NicknameInput.tsx

@@ -8,7 +8,6 @@ import {
   useEffect,
   useState,
 } from 'react'
-import { useSession } from 'next-auth/react'
 import TextInput from '.'
 
 const MAX_NICKNAME_LENGTH = 10
@@ -29,14 +28,6 @@ const NicknameInput = ({
 }: NicknameInputProps) => {
   const [errorMessage, setErrorMessage] = useState('')
 
-  const { data: session } = useSession()
-
-  useEffect(() => {
-    if (session) {
-      setValue(session.profile.nickName)
-    }
-  }, [session])
-
   useEffect(() => {
     setHasError(errorMessage.length > 0)
   }, [errorMessage])

src/lib/api/board.ts

@@ -23,9 +23,7 @@ export const postBoard = async (
 
 export const getTotalBoards = async (): Promise<number> => {
   const res = await get('/api/v1/boards/total-count', {
-    next: {
-      revalidate: 60 * 60, // 1 hour
-    },
+    cache: 'no-cache',
   })
 
   return res.data