From 5ce975f8fc42d1ca2502278d062c48e73be5782f Mon Sep 17 00:00:00 2001 From: choi Date: Wed, 20 Nov 2024 13:46:18 +0900 Subject: [PATCH] =?UTF-8?q?=EC=95=A8=EB=B2=94=20=EC=97=85=EB=A1=9C?= =?UTF-8?q?=EB=93=9C=20=EA=B4=80=EB=A0=A8=20=EC=98=A4=EB=A5=98=20=EC=88=98?= =?UTF-8?q?=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/modal/album-modal.tsx | 20 +++--- src/features/main/bar.tsx | 2 +- src/features/main/main-album.tsx | 104 ++++++++------------------- src/provider/userProvider.tsx | 1 + src/services/albumService.ts | 21 ++++++ 5 files changed, 63 insertions(+), 85 deletions(-) create mode 100644 src/services/albumService.ts diff --git a/src/components/modal/album-modal.tsx b/src/components/modal/album-modal.tsx index 0ad4b40..821ae85 100644 --- a/src/components/modal/album-modal.tsx +++ b/src/components/modal/album-modal.tsx @@ -26,9 +26,14 @@ const AlbumModal = () => { const albumModal = useAlbumModal(); const handleFileUpload = (files: File[]) => { + if (files.length > 0 && !files[0].type.startsWith("image/")) { + toast.error("이미지 파일만 업로드 가능합니다."); + return; + } + setFiles(files); - if (files.length > 0 && files[0].type.startsWith("image/")) { + if (files.length > 0) { const imageUrl = URL.createObjectURL(files[0]); setPreviewImage(imageUrl); } @@ -118,14 +123,11 @@ const AlbumModal = () => { reset(); albumModal.onClose(); } catch (error) { - if (error instanceof Error) { - toast.error(`문제가 발생하였습니다: ${error.message}`); - } else if (axios.isAxiosError(error) && error.response) { - toast.error( - `문제가 발생하였습니다: ${ - error.response.data?.message || "알 수 없는 오류" - }` - ); + if (axios.isAxiosError(error) && error.response?.data) { + const errorData = error.response.data; + toast.error(errorData.detail || "앨범 생성에 실패했습니다."); + } else if (error instanceof Error) { + toast.error(error.message); } else { toast.error("알 수 없는 오류가 발생했습니다."); } diff --git a/src/features/main/bar.tsx b/src/features/main/bar.tsx index b7dd2c8..7abacd0 100644 --- a/src/features/main/bar.tsx +++ b/src/features/main/bar.tsx @@ -113,7 +113,7 @@ export function Bar() { if (!isLoggedIn) { signinModal.onOpen(); } else { - router.push("/user/123"); + router.push(`/user/${user?.uuid}`); } }, }, diff --git a/src/features/main/main-album.tsx b/src/features/main/main-album.tsx index 84fd89b..c0610c5 100644 --- a/src/features/main/main-album.tsx +++ b/src/features/main/main-album.tsx @@ -1,79 +1,33 @@ "use client"; -import SquareContainer from "@/components/container/square-container"; -import { useUser } from "@/provider/userProvider"; +import { useEffect, useState } from "react"; import { useRouter } from "next/navigation"; +import { useUser } from "@/provider/userProvider"; +import { Album, getAllAlbums } from "@/services/albumService"; +import SquareContainer from "@/components/container/square-container"; + const MainAlbum = () => { const router = useRouter(); const { user } = useUser(); + const [albums, setAlbums] = useState([]); + + useEffect(() => { + const getAlbums = async () => { + try { + const data = await getAllAlbums(); + setAlbums(data); + } catch (error) { + console.error('앨범 로딩 실패:', error); + } + }; + + getAlbums(); + }, []); - const dummy = [ - { - id: 1, - src: "/images/music1.png", - name: "ROCK-STAR", - description: "2024 · IPCGRDN", - onClickName: () => router.push("/album/123"), - onClickDescription: () => router.push("/user/123"), - }, - { - id: 2, - src: "/images/music1.png", - name: "ROCK-STAR", - description: "2024 · IPCGRDN", - onClickName: () => router.push("/album/123"), - onClickDescription: () => router.push("/user/123"), - }, - { - id: 3, - src: "/images/music1.png", - name: "ROCK-STAR", - description: "2024 · IPCGRDN", - onClickName: () => router.push("/album/123"), - onClickDescription: () => router.push("/user/123"), - }, - { - id: 4, - src: "/images/music1.png", - name: "BREAK", - description: "2018 · PALM", - onClickName: () => router.push("/album/123"), - onClickDescription: () => router.push("/user/123"), - }, - { - id: 5, - src: "/images/music1.png", - name: "Thirsty", - description: "1988 · RARO", - onClickName: () => router.push("/album/123"), - onClickDescription: () => router.push("/user/123"), - }, - { - id: 6, - src: "/images/music1.png", - name: "산책", - description: "EP · BDD", - onClickName: () => router.push("/album/123"), - onClickDescription: () => router.push("/user/123"), - }, - { - id: 7, - src: "/images/music1.png", - name: "산책", - description: "EP · BDD", - onClickName: () => router.push("/album/123"), - onClickDescription: () => router.push("/user/123"), - }, - { - id: 8, - src: "/images/music1.png", - name: "산책", - description: "EP · BDD", - onClickName: () => router.push("/album/123"), - onClickDescription: () => router.push("/user/123"), - }, - ]; + if (!albums.length) { + return null; + } return (
@@ -84,15 +38,15 @@ const MainAlbum = () => {

님을 위한 앨범

- {dummy.map((item) => ( + {albums.map((album) => ( router.push(`/album/${album.uuid}`)} + onClickDescription={() => router.push(`/user/${album.uuid}`)} /> ))}
diff --git a/src/provider/userProvider.tsx b/src/provider/userProvider.tsx index 51b5f4c..1b29eb8 100644 --- a/src/provider/userProvider.tsx +++ b/src/provider/userProvider.tsx @@ -10,6 +10,7 @@ import { useAuth } from "./authProvider"; export interface Artist { uuid: string; name: string; + role: 'ROLE_USER'; email: string; artistImage: string; } diff --git a/src/services/albumService.ts b/src/services/albumService.ts new file mode 100644 index 0000000..f28cb8d --- /dev/null +++ b/src/services/albumService.ts @@ -0,0 +1,21 @@ +import axios from 'axios'; + +export interface Album { + uuid: string; + title: string; + description: string; + artImage: string; + releaseDate: string; +} + +const BASE_URL = process.env.NEXT_PUBLIC_API_BASE_URL; + +export const getAllAlbums = async (): Promise => { + try { + const response = await axios.get(`${BASE_URL}/album`); + return response.data; + } catch (error) { + console.error('앨범 데이터 조회 실패:', error); + throw error; + } +}; \ No newline at end of file