diff --git a/src/components/Login.tsx b/src/components/Login.tsx index af2c3fd..9f7da9d 100644 --- a/src/components/Login.tsx +++ b/src/components/Login.tsx @@ -28,12 +28,37 @@ export default function Login() { const { session, setSession } = useSessionStore() const [value, setValue, removeValue] = useLocalStorage<{ indivisualData: string }>('hanasysIndivisualState', { indivisualData: '' }) + // ID Save 기능을 위한 로컬스토리지 + const [savedLoginData, setSavedLoginData, removeSavedLoginData] = useLocalStorage<{ + loginId: string + idSaveEnabled: boolean + }>('hanasysLoginData', { + loginId: '', + idSaveEnabled: false, + }) + const reducer = (state: AccountState, newState: Partial) => ({ ...state, ...newState }) const [account, setAccount] = useReducer(reducer, { loginId: '', pwd: '', }) + // 컴포넌트 마운트 시 저장된 로그인 정보 불러오기 + useEffect(() => { + if (savedLoginData.idSaveEnabled) { + setIdSave(true) + setAccount({ loginId: savedLoginData.loginId }) + } else { + setIdSave(false) + setAccount({ loginId: '' }) + } + }, []) + + // ID Save 체크박스 변경 시 처리 (UI 상태만 변경) + const handleIdSaveChange = (checked: boolean) => { + setIdSave(checked) + } + const isValidEmail = (email: string) => { const emailRegex = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/ return emailRegex.test(email) @@ -102,6 +127,15 @@ export default function Login() { setValue({ indivisualData: account.pwd, }) + + // ID Save 체크박스 체크 시 저장 + idSave + ? setSavedLoginData({ + loginId: account.loginId, + idSaveEnabled: true, + }) + : removeSavedLoginData() + // 세션 정보 저장 console.log('🚀 ~ Login ~ loginData:', loginData) setSession({ @@ -158,7 +192,7 @@ export default function Login() {
- setIdSave(!idSave)} /> + handleIdSaveChange(e.target.checked)} />