Skip to content
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

Feat/issue-#163 #164

Merged
merged 1 commit into from
Dec 26, 2023
Merged

Feat/issue-#163 #164

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
30 changes: 25 additions & 5 deletions src/components/common/EditProfile/EditUserInfo.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,11 @@ import React, { useState, useEffect, useRef } from "react";
import { useNavigate } from "react-router-dom";
import { useDispatch, useSelector } from "react-redux";
import { GetUserInfo } from "../../../store/User-action";
import { setStateMsgInput, setNicknameInput } from "../../../store/UserInfoInputSlice";
import {
setUserIdInput,
setStateMsgInput,
setNicknameInput,
} from "../../../store/UserInfoInputSlice";
import LogoutButton from "../../organisms/EditProfile/LogoutButton";
import { useMediaQuery } from "react-responsive";
import styled from "styled-components";
Expand Down Expand Up @@ -63,6 +67,7 @@ const EditUserInfo = () => {
const stateMsg = localStorage.getItem("stateMsg");

// 편집 완료 전 인풋값 임시 저장할 곳
const userIdInput = useSelector((state) => state.userInfoInput.userIdInput);
const nicknameInput = useSelector((state) => state.userInfoInput.nicknameInput);
const stateMsgInput = useSelector((state) => state.userInfoInput.stateMsgInput);

Expand All @@ -72,6 +77,10 @@ const EditUserInfo = () => {
GetUserInfo(dispatch); // 유저 정보 get
}, [dispatch]);

const handleUserIdInputChange = (event) => {
dispatch(setUserIdInput(event.target.value)); // 임시 저장
};

const handleNicknameInputChange = (event) => {
dispatch(setNicknameInput(event.target.value)); // 임시 저장
};
Expand All @@ -98,12 +107,23 @@ const EditUserInfo = () => {
<UserInfo>
<input
type="text"
defaultValue={userId}
value={userId}
readOnly
defaultValue={userIdInput}
value={userIdInput}
// readOnly
onChange={handleUserIdInputChange}
placeholder="ID를 입력하세요"
// style={{ width: "100%" }}
className="w-full h-[44px] p-3 border rounded-md border-black outline-none"
className="w-full h-[44px] p-3 border rounded-md border-black focus:border-2 focus:border-[#9a0501] outline-none"
/>
{!userIdInput ? (
<div className="h-[24px] flex justify-center items-center">
<SmallText fontSize="12px" color="#9A0501">
ID는 필수 항목입니다.
</SmallText>
</div>
) : (
<div className="h-[24px] flex justify-center items-center"></div>
)}
</UserInfo>
</UserInfoContainer>

Expand Down
12 changes: 11 additions & 1 deletion src/components/common/EditProfile/ProfileSubmitButton.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,17 @@ const ProfileSubmitButton = () => {
navigate("/");
})
.catch((error) => {
console.error(`Failed to submit user info.`, error);
if (
error.response &&
error.response.status === 400 &&
error.response.data.error === "DUPLICATED_USER_NAME"
) {
// 에러 코드 400 && 에러 메시지 'DUPLICATED_USER_NAME'
alert("이미 사용 중인 ID입니다.");
} else {
// 다른 오류에 대한 처리
console.error(`Failed to submit user info.`, error);
}
});
};

Expand Down
6 changes: 4 additions & 2 deletions src/components/organisms/EditProfile/EditProfileTab.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,15 +21,17 @@ const EditProfileTab = () => {
const userId = localStorage.getItem("userId");
const nickname = localStorage.getItem("nickname");
const stateMsg = localStorage.getItem("stateMsg");

// 편집 완료 전 인풋값 임시 저장할 곳
const userIdInput = useSelector((state) => state.userInfoInput.userIdInput);
const nicknameInput = useSelector((state) => state.userInfoInput.nicknameInput);
const stateMsgInput = useSelector((state) => state.userInfoInput.stateMsgInput);

const navigate = useNavigate();
const dispatch = useDispatch();

const handleClickBackward = () => {
if (nickname != nicknameInput || stateMsg != stateMsgInput) {
if (userId != userIdInput || nickname != nicknameInput || stateMsg != stateMsgInput) {
const isConfirmed = confirm(`프로필 편집을 취소하시겠어요? 변경값은 저장되지 않아요.`);

if (isConfirmed) {
Expand All @@ -42,7 +44,7 @@ const EditProfileTab = () => {
};

const handleClickHome = () => {
if (nickname != nicknameInput || stateMsg != stateMsgInput) {
if (userId != userIdInput || nickname != nicknameInput || stateMsg != stateMsgInput) {
const isConfirmed = confirm(`프로필 편집을 취소하시겠어요? 변경값은 저장되지 않아요.`);

if (isConfirmed) {
Expand Down