diff --git a/frontend/src/pages/pc/admin/schedules/form/index.jsx b/frontend/src/pages/pc/admin/schedules/form/index.jsx index 45a352f..2d38f3a 100644 --- a/frontend/src/pages/pc/admin/schedules/form/index.jsx +++ b/frontend/src/pages/pc/admin/schedules/form/index.jsx @@ -1,5 +1,6 @@ import { useState, useEffect } from "react"; import { useNavigate, Link } from "react-router-dom"; +import { useQuery } from "@tanstack/react-query"; import { motion, AnimatePresence } from "framer-motion"; import { Home, ChevronRight } from "lucide-react"; import AdminLayout from "@/components/pc/admin/layout/Layout"; @@ -38,32 +39,28 @@ function ScheduleFormPage() { const navigate = useNavigate(); const { user, isAuthenticated } = useAdminAuth(); - const [categories, setCategories] = useState([]); const [selectedCategory, setSelectedCategory] = useState(null); - const [loading, setLoading] = useState(true); const [isInitialLoad, setIsInitialLoad] = useState(true); - // 카테고리 로드 - useEffect(() => { - if (!isAuthenticated) return; - - const fetchCategories = async () => { - try { - const data = await categoriesApi.getCategories(); - setCategories(data); - // 첫 번째 카테고리를 기본값으로 - if (data.length > 0) { - setSelectedCategory(data[0].id); - } - } catch (error) { - console.error("카테고리 로드 오류:", error); - } finally { - setLoading(false); + // 카테고리 로드 (React Query) + const { data: categories = [], isLoading: loading } = useQuery({ + queryKey: ["scheduleCategories"], + queryFn: categoriesApi.getCategories, + enabled: isAuthenticated, + staleTime: 10 * 60 * 1000, + onSuccess: (data) => { + if (data.length > 0 && !selectedCategory) { + setSelectedCategory(data[0].id); } - }; + }, + }); - fetchCategories(); - }, [isAuthenticated]); + // 카테고리 로드 시 기본값 설정 + useEffect(() => { + if (categories.length > 0 && !selectedCategory) { + setSelectedCategory(categories[0].id); + } + }, [categories, selectedCategory]); // 카테고리에 따른 폼 렌더링 const renderForm = () => {