Skip to content

Commit 2311e34

Browse files
minsukim-29cmminsukim-29cm
committed
fix: 프로필 이미지 수정 기능 임시 비활성화 및 관련 코드 주석 처리
1 parent ad0e0b8 commit 2311e34

4 files changed

Lines changed: 78 additions & 87 deletions

File tree

‎src/components/MyPage/ProfileCircle/ProfileCircle.tsx‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
1-
import EditCircleSVG from '@assets/edit_circle.svg?react';
1+
// TODO: 프로필 이미지 수정 기능 재오픈 시 아래 import와 편집 UI를 함께 복구한다.
2+
// import EditCircleSVG from '@assets/edit_circle.svg?react';
23
import ProfilePNG from '@assets/profile.png';
34
import { ProfileCircleContainer } from './ProfileCircle.Style';
45

@@ -10,17 +11,17 @@ const ProfileCircle = ({
1011
handleClickCircle,
1112
}: {
1213
profileImage: string;
13-
handleChangeFile: (e: React.ChangeEvent<HTMLInputElement>) => void;
14+
handleChangeFile?: (e: React.ChangeEvent<HTMLInputElement>) => void;
1415
size: 'small' | 'medium' | 'large';
1516
canEdit?: boolean;
1617
handleClickCircle?: (e: React.MouseEvent<HTMLLabelElement>) => void;
1718
}) => {
1819
return (
1920
<ProfileCircleContainer size={size} onClick={handleClickCircle}>
2021
<img src={profileImage ?? ProfilePNG} />
21-
{canEdit && (
22+
{canEdit && handleChangeFile && (
2223
<>
23-
<EditCircleSVG />
24+
{/* <EditCircleSVG /> */}
2425
<input type="file" accept="image/*" onChange={handleChangeFile} />
2526
</>
2627
)}

‎src/pages/MyPage/Edit/Edit.tsx‎

Lines changed: 21 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,16 @@ import useAuthInfo from '@hooks/useAuthInfo';
33
import useRouter from '@router/useRouter';
44
import MyPageInput, { MyPageInputProps } from '@components/MyPage/MyPageInput/MyPageInput';
55
import ProfileCircle from '@components/MyPage/ProfileCircle/ProfileCircle';
6-
import { fetchAuthNickname, fetchUpdateUserImage, fetchUpdateUserProfile } from '@controllers/auth/api';
6+
import { fetchAuthNickname, fetchUpdateUserProfile } from '@controllers/auth/api';
77
import ProfilePNG from '@assets/profile.png';
88
import { EditProfileButton, EditProfileValueContainer, RegisterContainer, RegisterContent } from './Edit.Style';
99

1010
const EditProfile = () => {
1111
const { navToEditProfileDone } = useRouter();
1212

1313
const { userInfo, setUserInfo } = useAuthInfo();
14-
const [isProgileImageChanged, setIsProfileImageChanged] = useState(false);
1514

1615
const oldValues = {
17-
profileImage: userInfo?.profileImage ?? '',
1816
name: userInfo?.nickname ?? '',
1917
birth: '',
2018
};
@@ -63,11 +61,7 @@ const EditProfile = () => {
6361
}
6462
}
6563

66-
if (
67-
values.name === oldValues.name &&
68-
values.birth === oldValues.birth &&
69-
!isProgileImageChanged
70-
) {
64+
if (values.name === oldValues.name && values.birth === oldValues.birth) {
7165
errors.name = ' ';
7266
errors.birth = '수정된 내용이 없습니다.';
7367
}
@@ -158,32 +152,29 @@ const EditProfile = () => {
158152
navToEditProfileDone();
159153
};
160154

161-
const handleChangeFile = (e: React.ChangeEvent<HTMLInputElement>) => {
162-
const file = e.target.files?.[0];
163-
if (!file) return;
164-
165-
const reader = new FileReader();
166-
reader.readAsDataURL(file);
167-
168-
reader.onloadend = async () => {
169-
const data = await fetchUpdateUserImage(reader.result as string);
170-
if (data) {
171-
setUserInfo({ profileImage: reader.result as string });
172-
setIsProfileImageChanged(true);
173-
} else {
174-
alert('프로필 이미지 업데이트 실패');
175-
}
176-
};
177-
};
155+
// TODO: 프로필 이미지 수정 기능 재오픈 시 아래 핸들러와 ProfileCircle props를 복구한다.
156+
// const handleChangeFile = (e: React.ChangeEvent<HTMLInputElement>) => {
157+
// const file = e.target.files?.[0];
158+
// if (!file) return;
159+
//
160+
// const reader = new FileReader();
161+
// reader.readAsDataURL(file);
162+
//
163+
// reader.onloadend = async () => {
164+
// const data = await fetchUpdateUserImage(reader.result as string);
165+
// if (data) {
166+
// setUserInfo({ profileImage: reader.result as string });
167+
// } else {
168+
// alert('프로필 이미지 업데이트 실패');
169+
// }
170+
// };
171+
// };
178172

179173
return (
180174
<RegisterContainer>
181175
<RegisterContent>
182-
<ProfileCircle
183-
profileImage={userInfo?.profileImage ?? ProfilePNG}
184-
handleChangeFile={handleChangeFile}
185-
size="large"
186-
/>
176+
{/* 프로필 이미지 수정은 임시 비활성화 상태 */}
177+
<ProfileCircle profileImage={userInfo?.profileImage ?? ProfilePNG} size="large" canEdit={false} />
187178
<EditProfileValueContainer>
188179
{valueInputs.map((e) => (
189180
<MyPageInput

‎src/pages/MyPage/Profile/Profile.tsx‎

Lines changed: 34 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,13 @@
11
import useAuthInfo from '@hooks/useAuthInfo';
22
import useRouter from '@router/useRouter';
33
import ProfileCircle from '@components/MyPage/ProfileCircle/ProfileCircle';
4-
import { fetchUpdateUserImage } from '@controllers/auth/api';
54
import ProfilePNG from '@assets/profile.png';
65
import RightArrowThickSVG from '@assets/right_arrow_thick.svg?react';
76
import { ProfileContainer, ProfileContents } from './Profile.Style';
87

98
const MyPageProfile = () => {
109
const { navToEditProfile } = useRouter();
11-
const { isLogin, userInfo, handleNavigateLogin, setUserInfo } = useAuthInfo();
10+
const { isLogin, userInfo, handleNavigateLogin } = useAuthInfo();
1211

1312
const username = userInfo?.nickname ?? '아직 정보가 없어요!';
1413
const rawEmail = userInfo?.email;
@@ -22,46 +21,42 @@ const MyPageProfile = () => {
2221
}
2322
};
2423

25-
const handleChangeFile = (e: React.ChangeEvent<HTMLInputElement>) => {
26-
const file = e.target.files?.[0];
27-
28-
if (!file) return;
29-
30-
const fileType = file.type;
31-
32-
if (!fileType.includes('image')) {
33-
alert(`해당 파일은 이미지 파일이 아닙니다.`);
34-
return;
35-
}
36-
37-
const reader = new FileReader();
38-
reader.readAsDataURL(file);
39-
40-
reader.onloadend = async () => {
41-
const data = await fetchUpdateUserImage(reader.result as string);
42-
if (data) {
43-
setUserInfo({ profileImage: reader.result as string });
44-
} else {
45-
alert('프로필 이미지 업데이트 실패');
46-
}
47-
};
48-
};
49-
50-
const handleClickProfileImage = (e: React.MouseEvent<HTMLLabelElement>) => {
51-
if (isLogin) {
52-
e.stopPropagation();
53-
}
54-
};
24+
// TODO: 프로필 이미지 수정 기능 재오픈 시 아래 핸들러와 ProfileCircle props를 복구한다.
25+
// const handleChangeFile = (e: React.ChangeEvent<HTMLInputElement>) => {
26+
// const file = e.target.files?.[0];
27+
//
28+
// if (!file) return;
29+
//
30+
// const fileType = file.type;
31+
//
32+
// if (!fileType.includes('image')) {
33+
// alert('해당 파일은 이미지 파일이 아닙니다.');
34+
// return;
35+
// }
36+
//
37+
// const reader = new FileReader();
38+
// reader.readAsDataURL(file);
39+
//
40+
// reader.onloadend = async () => {
41+
// const data = await fetchUpdateUserImage(reader.result as string);
42+
// if (data) {
43+
// setUserInfo({ profileImage: reader.result as string });
44+
// } else {
45+
// alert('프로필 이미지 업데이트 실패');
46+
// }
47+
// };
48+
// };
49+
//
50+
// const handleClickProfileImage = (e: React.MouseEvent<HTMLLabelElement>) => {
51+
// if (isLogin) {
52+
// e.stopPropagation();
53+
// }
54+
// };
5555

5656
return (
5757
<ProfileContainer onClick={handleClickProfile}>
58-
<ProfileCircle
59-
profileImage={userInfo?.profileImage ?? ProfilePNG}
60-
handleChangeFile={handleChangeFile}
61-
size="medium"
62-
canEdit={isLogin}
63-
handleClickCircle={handleClickProfileImage}
64-
/>
58+
{/* 프로필 이미지 수정은 임시 비활성화 상태 */}
59+
<ProfileCircle profileImage={userInfo?.profileImage ?? ProfilePNG} size="medium" canEdit={false} />
6560
<ProfileContents>
6661
<p>
6762
{username}

‎src/pages/Register/Register.tsx‎

Lines changed: 18 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -73,7 +73,9 @@ const Register = () => {
7373
system: '',
7474
});
7575

76-
const [profileImage, setProfileImage] = useState<string | null>(null);
76+
// TODO: 회원가입 프로필 이미지 수정 기능 재오픈 시 아래 state를 복구한다.
77+
// const [profileImage, setProfileImage] = useState<string | null>(null);
78+
const profileImage: string | null = null;
7779

7880
const handleChangeValue = (e: ChangeEvent<HTMLInputElement>) => {
7981
const { name, value } = e.target;
@@ -236,7 +238,7 @@ const Register = () => {
236238
const provider = location.state?.provider || sessionStorage.getItem('register_provider') || '';
237239

238240
const res = await fetchAuthRegister(
239-
profileImage as string,
241+
profileImage ?? '',
240242
email,
241243
values.name,
242244
values.birth,
@@ -257,22 +259,24 @@ const Register = () => {
257259
navToTerm(termKey);
258260
};
259261

260-
const handleChangeFile = (e: React.ChangeEvent<HTMLInputElement>) => {
261-
const file = e.target.files?.[0];
262-
if (!file) return;
263-
264-
const reader = new FileReader();
265-
reader.readAsDataURL(file);
266-
267-
reader.onloadend = () => {
268-
setProfileImage(reader.result as string);
269-
};
270-
};
262+
// TODO: 회원가입 프로필 이미지 수정 기능 재오픈 시 아래 핸들러와 ProfileCircle props를 복구한다.
263+
// const handleChangeFile = (e: React.ChangeEvent<HTMLInputElement>) => {
264+
// const file = e.target.files?.[0];
265+
// if (!file) return;
266+
//
267+
// const reader = new FileReader();
268+
// reader.readAsDataURL(file);
269+
//
270+
// reader.onloadend = () => {
271+
// setProfileImage(reader.result as string);
272+
// };
273+
// };
271274

272275
return (
273276
<RegisterContainer>
274277
<RegisterContent>
275-
<ProfileCircle profileImage={profileImage ?? ProfilePNG} handleChangeFile={handleChangeFile} size="large" />
278+
{/* 회원가입 프로필 이미지 수정은 임시 비활성화 상태 */}
279+
<ProfileCircle profileImage={profileImage ?? ProfilePNG} size="large" canEdit={false} />
276280
<RegisterValueContainer>
277281
{valueInputs.map((e) => (
278282
<MyPageInput key={e.name} name={e.name} error={e.error} title={e.title} sub={e.sub} inputs={e.inputs} />

0 commit comments

Comments
 (0)