diff --git a/src/pages/Profile/EditForm.js b/src/pages/Profile/EditForm.js index e2dc188..e493876 100644 --- a/src/pages/Profile/EditForm.js +++ b/src/pages/Profile/EditForm.js @@ -1,53 +1,40 @@ +// ✅ EditForm.js import React from 'react'; function EditForm({ form, onChange, onSubmit }) { return ( -
); } -export default EditForm; +export default EditForm; \ No newline at end of file diff --git a/src/pages/Profile/SSHKeyForm.js b/src/pages/Profile/SSHKeyForm.js new file mode 100644 index 0000000..bd7426b --- /dev/null +++ b/src/pages/Profile/SSHKeyForm.js @@ -0,0 +1,79 @@ +// ✅ SSHKeyForm.js +import React, { useEffect, useState } from 'react'; +import authApi from '../../api/authApi'; + +function SSHKeyForm({ form, onChange, onSubmit }) { + const [keyInfo, setKeyInfo] = useState(null); + + useEffect(() => { + const fetchKeyInfo = async () => { + try { + const res = await authApi.get('/api/auth/ssh-key/info/'); + setKeyInfo(res.data); + } catch (err) { + console.error("SSH 키 정보 조회 실패", err); + } + }; + + fetchKeyInfo(); + }, []); + + const handleDelete = async () => { + if (!window.confirm("등록된 SSH 키를 삭제하시겠습니까?")) return; + + try { + await authApi.delete('/api/auth/ssh-key/'); + alert("SSH 키가 삭제되었습니다."); + setKeyInfo(null); + } catch (err) { + console.error("삭제 실패", err); + alert("SSH 키 삭제에 실패했습니다."); + } + }; + + return ( + + ); +} + +export default SSHKeyForm; \ No newline at end of file diff --git a/src/pages/Profile/index.js b/src/pages/Profile/index.js index 7a581e4..2630476 100644 --- a/src/pages/Profile/index.js +++ b/src/pages/Profile/index.js @@ -1,15 +1,18 @@ +// ✅ index.js import React, { useEffect, useState } from 'react'; import { useNavigate } from 'react-router-dom'; -import EditForm from './EditForm'; import authApi from '../../api/authApi'; +import EditForm from './EditForm'; +import SSHKeyForm from './SSHKeyForm'; function ProfilePage() { const navigate = useNavigate(); - const [form, setForm] = useState({ name: '', email: '', - desc: '' // ✅ desc 상태 추가 + desc: '', + encrypted_private_key_name: '', + private_key: '' }); useEffect(() => { @@ -22,8 +25,8 @@ function ProfilePage() { const fetchUser = async () => { try { const res = await authApi.get('/api/auth/me/'); - const { name, email, desc } = res.data; - setForm({ name, email, desc }); // ✅ desc 상태 반영 + const { name, email, desc, encrypted_private_key_name } = res.data; + setForm((prev) => ({ ...prev, name, email, desc, encrypted_private_key_name })); } catch (err) { console.error(err); navigate('/login'); @@ -34,13 +37,19 @@ function ProfilePage() { }, [navigate]); const handleChange = (e) => { - setForm({ ...form, [e.target.name]: e.target.value }); + const { name, value } = e.target; + setForm((prev) => ({ ...prev, [name]: value })); }; - const handleSubmit = async (e) => { + const handleProfileSubmit = async (e) => { e.preventDefault(); try { - await authApi.put('/api/auth/me/', form); // ✅ desc 포함해서 PUT + await authApi.put('/api/auth/me/', { + name: form.name, + email: form.email, + desc: form.desc, + encrypted_private_key_name: form.encrypted_private_key_name + }); alert('회원정보가 수정되었습니다.'); } catch (err) { console.error(err); @@ -48,11 +57,43 @@ function ProfilePage() { } }; + const handleKeySubmit = async (e) => { + e.preventDefault(); + if (!form.private_key) { + alert('키 내용을 입력해주세요.'); + return; + } + + try { + await authApi.post('/api/auth/ssh-key/', { + private_key: form.private_key, + key_name: form.encrypted_private_key_name + }); + alert('SSH 키가 등록되었습니다.'); + setForm((prev) => ({ ...prev, private_key: '' })); + } catch (err) { + console.error(err); + alert('SSH 키 등록 실패'); + } + }; + return ( -