Skip to content

[FEAT] 프로필 수정 UX 조정 #98

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Emithen wants to merge 2 commits into
base: develop
Choose a base branch
from
Open

[FEAT] 프로필 수정 UX 조정 #98

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
557b40f
feat: 프로필 수정 UX 조정
Emithen Feb 11, 2026
392083a
fix: 리뷰 반영
Emithen Feb 11, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
45 changes: 28 additions & 17 deletions src/components/pages/my/edit/editPage.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,26 +68,36 @@ const EditPage = () => {
const debouncedNickname = useDebounce<string>(nickname || '', 500)

useEffect(() => {
if (debouncedNickname && debouncedNickname.length > 0) {
async function validateNickname() {
try {
const res = await checkNickname(debouncedNickname)
if (!res.isAvailable) {
setNickNameMessage('이미 사용 중인 닉네임입니다.')
} else if (!res.isMeaningful) {
setNickNameMessage('의미 있는 닉네임을 입력해주세요.')
} else if (!res.isClean) {
setNickNameMessage('욕설을 포함한 닉네임은 사용할 수 없습니다.')
} else {
setNickNameMessage(null)
}
} catch {
setNickNameMessage('닉네임 체크 중 오류가 발생했습니다.')
// 닉네임을 입력하지 않았거나 빈 문자열이라면 초기화 후 리턴
if (!debouncedNickname) {
setNickNameMessage(null)
return
}

// 현재 내 닉네임과 같다면 중복 체크를 하지 않음
if (debouncedNickname === myPageData?.nickname) {
setNickNameMessage(null)
return
}

async function validateNickname() {
try {
const res = await checkNickname(debouncedNickname)
if (!res.isAvailable) {
setNickNameMessage('이미 사용 중인 닉네임입니다.')
} else if (!res.isMeaningful) {
setNickNameMessage('의미 있는 닉네임을 입력해주세요.')
} else if (!res.isClean) {
setNickNameMessage('욕설을 포함한 닉네임은 사용할 수 없습니다.')
} else {
setNickNameMessage(null)
Copy link
Collaborator

@topeanut topeanut Feb 11, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

지저분한데.. switch문..?

}
} catch {
setNickNameMessage('닉네임 체크 중 오류가 발생했습니다.')
}
validateNickname()
}
}, [debouncedNickname])
validateNickname()
}, [debouncedNickname, myPageData])

useEffect(() => {
console.log('전역 상태 nickname', myPageData?.nickname)
Copy link
Collaborator

@topeanut topeanut Feb 11, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

요거좀 지워주세용

Expand Down Expand Up @@ -258,6 +268,7 @@ const EditPage = () => {
<MBTIBottomSheet
onClose={() => setMbtiBottomSheetOpen(false)}
setMbti={setMbti}
mbti={mbti as MBTI}
Copy link
Collaborator

@topeanut topeanut Feb 11, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

타입 추론이 왜 안되었죵

/>
)}

Expand Down
12 changes: 7 additions & 5 deletions src/components/pages/onboarding/mbtiBottomSheet.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,13 +7,15 @@ import { MBTI } from '@/types/member'
interface MBTIBottomSheetProps {
onClose: () => void
setMbti: (mbti: MBTI) => void
mbti?: MBTI
}

const MBTIBottomSheet = ({ onClose, setMbti }: MBTIBottomSheetProps) => {
const [selectedEI, setSelectedEI] = useState('')
const [selectedNS, setSelectedNS] = useState('')
const [selectedTF, setSelectedTF] = useState('')
const [selectedPJ, setSelectedPJ] = useState('')
const MBTIBottomSheet = ({ onClose, setMbti, mbti }: MBTIBottomSheetProps) => {
console.log('[MBTIBottomSheet] ', mbti?.[0])
Copy link
Collaborator

@topeanut topeanut Feb 11, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

콘솔이 남아있읍니다

const [selectedEI, setSelectedEI] = useState(mbti?.[0] ?? '')
const [selectedNS, setSelectedNS] = useState(mbti?.[1] ?? '')
const [selectedTF, setSelectedTF] = useState(mbti?.[2] ?? '')
const [selectedPJ, setSelectedPJ] = useState(mbti?.[3] ?? '')
Copy link
Collaborator

@topeanut topeanut Feb 11, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

상태가 4개나 되네요
이러니 식은 어떤가요

const [mbtiState, setMbtiState] = useState({
  EI: mbti?.[0] ?? '',
  NS: mbti?.[1] ?? '',
  TF: mbti?.[2] ?? '',
  PJ: mbti?.[3] ?? '',
})


const handleSelectMBTI = () => {
onClose()
Expand Down