-
-
-
- U
-
-
-
-
- {user?.name || "U"}
+ <>
+ {profile ? (
+
+
+
+
+ )}
+
);
}
diff --git a/src/components/modal/modal-provider.tsx b/src/components/modal/modal-provider.tsx
index 488138e..5682a1e 100644
--- a/src/components/modal/modal-provider.tsx
+++ b/src/components/modal/modal-provider.tsx
@@ -13,6 +13,7 @@ import { SigninModal } from "./signin-modal";
import { MobileUploadMenu } from "../bar/mobile-upload-menu";
import { MobileSettingMenu } from "../bar/mobile-setting-menu";
+import ProfileModal from "./profile-modal";
const ModalProvider = () => {
const [isMounted, setIsMounted] = useState(false);
@@ -35,6 +36,7 @@ const ModalProvider = () => {
(null);
+ const [isLoading, setIsloading] = useState(false);
+ const profileModal = useProfileModal();
+
+ const onChange = (open: boolean) => {
+ if (!open) {
+ reset();
+ profileModal.onClose();
+ }
+ };
+
+ const handleFileUpload = (event: React.ChangeEvent) => {
+ const files = event.target.files;
+ if (files && files.length > 0) {
+ const file = files[0];
+ if (!file.type.startsWith("image/")) {
+ toast.error("이미지 파일만 업로드 가능합니다.");
+ return;
+ }
+
+ setFile(file);
+ }
+ };
+
+ const uploadToS3 = async (file: File) => {
+ const formData = new FormData();
+ formData.append("file", file);
+
+ const response = await axios.post(
+ `${process.env.NEXT_PUBLIC_API_BASE_URL}/upload/images`,
+ formData,
+ {
+ headers: {
+ "Content-Type": "multipart/form-data",
+ },
+ }
+ );
+
+ if (response.status === 201) {
+ return response.data;
+ } else {
+ throw new Error("이미지 업로드에 실패했습니다.");
+ }
+ };
+
+ const FormSchema = z.object({
+ name: z.string().min(1, "이름은 필수입니다.").max(20, "20자 이하로 입력하세요"),
+ description: z.string().max(500, "소개는 500자 이내로 작성하세요").optional(),
+ link1: z
+ .string()
+ .regex(/^https?:\/\//, "http:// 또는 https:// 형식의 URL을 입력하세요")
+ .optional(),
+ link2: z
+ .string()
+ .regex(/^https?:\/\//, "http:// 또는 https:// 형식의 URL을 입력하세요")
+ .optional(),
+});
+
+ const {
+ register,
+ handleSubmit,
+ reset,
+ formState: { errors },
+ } = useForm({
+ resolver: zodResolver(FormSchema),
+ defaultValues: {
+ name: "",
+ description: "",
+ link1: "",
+ link2: "",
+ profileImage: null,
+ isMain: true,
+ },
+ });
+
+ const onSubmit: SubmitHandler = async (values) => {
+ try {
+ setIsloading(true);
+
+ const profileImage = file;
+ if (!profileImage) {
+ toast.error("프로필 사진이 필요합니다.");
+ return;
+ }
+
+ const profileImageUrl = await uploadToS3(profileImage);
+
+ const requestData = {
+ ...values,
+ profileImage: profileImageUrl,
+ };
+
+ const response = await axios.post(
+ `${process.env.NEXT_PUBLIC_API_BASE_URL}/profile`,
+ requestData,
+ {
+ withCredentials: true,
+ }
+ );
+
+ if (response.status !== 201) {
+ throw new Error("프로필 업로드에 실패했습니다.");
+ }
+
+ toast.success("프로필이 업로드되었습니다.");
+ reset();
+ profileModal.onClose();
+ } catch (error) {
+ if (axios.isAxiosError(error) && error.response?.data) {
+ const errorData = error.response.data;
+ toast.error(
+ errorData.detail || "프로필 업로드 중 오류가 발생했습니다."
+ );
+ } else {
+ toast.error("프로필 업로드 과정에서 오류가 발생했습니다.");
+ }
+ } finally {
+ setIsloading(false);
+ }
+ };
+
+ return (
+ ((set) => ({
+ isOpen: false,
+ onOpen: () => set({ isOpen: true }),
+ onClose: () => set({ isOpen: false }),
+}));
+
+export default useProfileModal;
\ No newline at end of file
diff --git a/src/services/profileService.ts b/src/services/profileService.ts
new file mode 100644
index 0000000..072addf
--- /dev/null
+++ b/src/services/profileService.ts
@@ -0,0 +1,53 @@
+import { api } from "@/lib/axios";
+import axios from "axios";
+
+export interface Profile {
+ name: string;
+ description: string;
+ link1: string;
+ link2: string;
+ profileImage: string;
+ isMain: true;
+}
+
+export const isProfile = async () => {
+ try {
+ const response = await api.get("/profile");
+
+ console.log(response.data);
+
+ if (response.status === 200) {
+ return true;
+ } else {
+ return false;
+ }
+
+ } catch (error) {
+ if (axios.isAxiosError(error)) {
+ console.error(
+ `프로필 데이터 조회 실패: ${error.response?.status}`,
+ error.message
+ );
+ } else {
+ console.error("프로필 데이터 조회 중 알 수 없는 오류 발생:", error);
+ }
+ throw error;
+ };
+};
+
+export const getProfile = async (): Promise => {
+ try {
+ const response = await api.get("/profile");
+ return response.data;
+ } catch (error) {
+ if (axios.isAxiosError(error)) {
+ console.error(
+ `앨범 데이터 조회 실패: ${error.response?.status}`,
+ error.message
+ );
+ } else {
+ console.error("앨범 데이터 조회 중 알 수 없는 오류 발생:", error);
+ }
+ throw error;
+ }
+};
+
-
+
+ U
+
+
+
-
-
+
+
-
-
+ Hello! My name is Raro, and im passionate about exploring new
+ ideas and cultures. I enjoy reading, traveling, and meeting new
+ people. Currently, im pursuing my interests in technology and
+ innovation, aiming to make a positive impact in the world. I
+ believe in lifelong learning and always seek to grow personally
+ and professionally
-
-
-
- Hello! My name is Raro, and im passionate about exploring new ideas
- and cultures. I enjoy reading, traveling, and meeting new people.
- Currently, im pursuing my interests in technology and innovation,
- aiming to make a positive impact in the world. I believe in lifelong
- learning and always seek to grow personally and professionally
-
-
-
-
-
-
-
-
- {tabs.map((tab) => (
-
-
- ))}
-
-
-
-
-
-
-
-
-
- 최신순
-
-
- 좋아요순
-
-
-
-
-
-
- {activeTab === "track" ? (
-
-
+
+
+ {activeTab === "track" ? (
+
+
+ ) : (
+
+
+
+
+ U
+
+
+
+ {user?.name || "U"}
+
+ 프로필이 아직 생성되지 않았습니다.
+ 프로필을 생성해주세요. +
+ + 프로필을 생성해주세요. +