diff --git a/src/api.js b/src/api.js index d570b3d..64c873a 100644 --- a/src/api.js +++ b/src/api.js @@ -678,4 +678,5 @@ export const disconnectYoutube = () => apiPost('/api/music/youtu export const startBatchGen = (payload) => apiPost('/api/music/generate-batch', payload); export const getBatchJob = (id) => apiGet(`/api/music/generate-batch/${id}`); export const listBatchJobs = (status='all') => apiGet(`/api/music/generate-batch?status=${status}`); +export const listGenres = () => apiGet('/api/music/genres'); diff --git a/src/pages/music/MusicStudio.jsx b/src/pages/music/MusicStudio.jsx index 41728a7..cb03bdf 100644 --- a/src/pages/music/MusicStudio.jsx +++ b/src/pages/music/MusicStudio.jsx @@ -17,6 +17,7 @@ import { generateVideo, startBatchGen, getBatchJob, + listGenres, } from '../../api'; import PullToRefresh from '../../components/PullToRefresh'; import FAB from '../../components/FAB'; @@ -603,6 +604,7 @@ export default function MusicStudio() { const [batchAutoPipe, setBatchAutoPipe] = useState(true); const [currentBatch, setCurrentBatch] = useState(null); const [batchPolling, setBatchPolling] = useState(false); + const [batchGenresList, setBatchGenresList] = useState(['lo-fi', 'phonk', 'ambient', 'pop']); const batchPollRef = useRef(null); const activeGenre = GENRES.find((g) => g.id === genre); @@ -680,6 +682,19 @@ export default function MusicStudio() { } }; + /* ── 배치: 지원 장르 목록 fetch (mount 시 1회) ── */ + useEffect(() => { + listGenres() + .then((r) => { + if (Array.isArray(r?.genres) && r.genres.length) { + setBatchGenresList(r.genres); + if (!r.genres.includes(batchGenre)) setBatchGenre(r.genres[0]); + } + }) + .catch(() => { /* fallback hardcoded list 유지 */ }); + // eslint-disable-next-line react-hooks/exhaustive-deps + }, []); + /* ── 배치 폴링 ── */ useEffect(() => { if (!batchPolling || !currentBatch?.id) return; @@ -1332,10 +1347,11 @@ export default function MusicStudio() {