diff --git a/src/App.tsx b/src/App.tsx index d3a460a..b91763b 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -39,12 +39,13 @@ const App = () => { const userToken = useRecoilValue(userTokenState); const { initializeCategory } = handleCategory(); useEffect(() => { - getCategories() - .then((res) => { - setCategories(initializeCategory(res)); - }) - .catch((err) => console.log(err)); - }, []); + userToken && + getCategories() + .then((res) => { + setCategories(initializeCategory(res)); + }) + .catch((err) => console.log(err)); + }, [userToken]); return ( diff --git a/src/components/Home/InsightVideos.tsx b/src/components/Home/InsightVideos.tsx index 0970731..6075a38 100644 --- a/src/components/Home/InsightVideos.tsx +++ b/src/components/Home/InsightVideos.tsx @@ -8,10 +8,13 @@ interface InsightVideosProps { popularHashtags: string[]; } -const InsightVideos: React.FC = ({ username, popularHashtags }) => { - const formattedHashtags = popularHashtags.map(tag => '#' + tag); - const [categoryItems] = useState([]); - const [checkedItems, setCheckedItems] = useState([]); +const InsightVideos: React.FC = ({ + username, + popularHashtags, +}) => { + const formattedHashtags = popularHashtags.map((tag) => '#' + tag); + const [categoryItems] = useState([]); + const [checkedItems, setCheckedItems] = useState([]); return ( @@ -23,16 +26,16 @@ const InsightVideos: React.FC = ({ username, popularHashtags 콘텐츠에요! -
- +
+
); - }; +}; export default InsightVideos; diff --git a/src/components/category/Card.tsx b/src/components/category/Card.tsx index 34658dd..7239bc4 100644 --- a/src/components/category/Card.tsx +++ b/src/components/category/Card.tsx @@ -60,7 +60,6 @@ const Card: React.FC = ({ prev[id] = !prev[id]; setCheckedVideos(prev); }; - console.log(videos); return ( {videos.map((video, idx) => ( diff --git a/src/components/layout/sideBar/AddCategory.tsx b/src/components/layout/sideBar/AddCategory.tsx index 5e3b760..5909ab6 100644 --- a/src/components/layout/sideBar/AddCategory.tsx +++ b/src/components/layout/sideBar/AddCategory.tsx @@ -2,12 +2,12 @@ import * as AddCategoryStyle from '@/styles/layout/sideBar/AddCategory.style'; import PlusSvg from '@/assets/icons/plus.svg?react'; import { useRecoilValue, useSetRecoilState } from 'recoil'; import { topCategoryModalState } from '@/stores/modal'; -import { userState } from '@/stores/user'; +import { userTokenState } from '@/stores/user'; import { useState } from 'react'; import GuestNoticeModal from '@/components/modals/GuestNoticeModal'; const AddCategory = () => { - const isUser = useRecoilValue(userState); + const isUser = useRecoilValue(userTokenState); const setTopCategoryModal = useSetRecoilState(topCategoryModalState); const [isGuestNoticeModalOpen, setIsGuestNoticeModalOpen] = useState(false); diff --git a/src/components/layout/sideBar/index.tsx b/src/components/layout/sideBar/index.tsx index 72fcc44..e102bb2 100644 --- a/src/components/layout/sideBar/index.tsx +++ b/src/components/layout/sideBar/index.tsx @@ -1,6 +1,6 @@ import * as SideBarStyles from '@/styles/layout/sideBar'; import { useRecoilValue } from 'recoil'; -import { userState } from '@/stores/user'; +import { userTokenState } from '@/stores/user'; import GuestMode from './GuestMode'; import UserMode from './UserMode'; import AddCategory from './AddCategory'; @@ -8,7 +8,7 @@ import ConvertVideo from './ConvertVideo'; import VinoGuide from './VinoGuide'; const SideBar = () => { - const isUser = useRecoilValue(userState); + const isUser = useRecoilValue(userTokenState); return ( diff --git a/src/pages/CategoryPage.tsx b/src/pages/CategoryPage.tsx index 07a6f2b..eda9aa3 100644 --- a/src/pages/CategoryPage.tsx +++ b/src/pages/CategoryPage.tsx @@ -137,7 +137,7 @@ const CategoryPage = () => { )} - {videos.length === 0 && } + {(videos.length === 0 || videos === undefined) && } {videos.length > 0 && ( ({ key: 'user-token', default: null,