diff --git a/front-end/src/app/categories/[id]/page.tsx b/front-end/src/app/categories/[id]/page.tsx deleted file mode 100644 index bf95c7db..00000000 --- a/front-end/src/app/categories/[id]/page.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import React from 'react'; - -const Categories = () => { - return ( -
-

카테고리 페이지

-
- ); -}; - -export default Categories; diff --git a/front-end/src/components/authservice/registerservice.tsx b/front-end/src/components/authservice/registerservice.tsx index 992a7143..52c87fce 100644 --- a/front-end/src/components/authservice/registerservice.tsx +++ b/front-end/src/components/authservice/registerservice.tsx @@ -6,8 +6,5 @@ export const registerUser = async (userData: { password: string; confirmPassword: string; }) => { - const response = await fetchRegisterUser(userData); - if (response.status === 200 || response.status === 201) { - alert('회원가입 완료'); - } + await fetchRegisterUser(userData); }; diff --git a/front-end/src/components/playlist/CategoryPlaylist.tsx b/front-end/src/components/playlist/CategoryPlaylist.tsx index 552e461b..34316672 100644 --- a/front-end/src/components/playlist/CategoryPlaylist.tsx +++ b/front-end/src/components/playlist/CategoryPlaylist.tsx @@ -145,4 +145,4 @@ const CategoryPlaylist: React.FC = ({ category: initialCa ); }; -export default CategoryPlaylist; \ No newline at end of file +export default CategoryPlaylist; diff --git a/front-end/src/components/playlist/Modal.tsx b/front-end/src/components/playlist/Modal.tsx index 50b2de76..0ece3404 100644 --- a/front-end/src/components/playlist/Modal.tsx +++ b/front-end/src/components/playlist/Modal.tsx @@ -87,7 +87,7 @@ const Modal: React.FC = ({ } finally { setLoadingPlaylists(false); } - }, [token, setPlaylists, getVideo, detailPlaylist]); + }, [token, setPlaylists]); const handleSaveVideo = async () => { if (!selectVideo) { @@ -211,7 +211,7 @@ const Modal: React.FC = ({ }} className={isVideoInPlaylist ? 'remove-video-button' : 'add-video-button'} > - {isVideoInPlaylist ? 'X' : '+'} + {isVideoInPlaylist ? '-' : '+'}

{playlist.playlistName}

diff --git a/front-end/src/components/playlist/TeacherPlaylist.tsx b/front-end/src/components/playlist/TeacherPlaylist.tsx index 54b23a3c..6e4c1736 100644 --- a/front-end/src/components/playlist/TeacherPlaylist.tsx +++ b/front-end/src/components/playlist/TeacherPlaylist.tsx @@ -1,15 +1,12 @@ -+91 --237 -Lines changed: 91 additions & 237 deletions -Original file line number Original file line Diff line number Diff line change -@@ -1,314 +1,168 @@ 'use client'; import React, { useCallback, useEffect, useState } from 'react'; import { useRouter, useSearchParams } from 'next/navigation'; + import { useQuery } from '@tanstack/react-query'; import { getAllVideos, getLatestVideos } from '@/app/api/teacherAPI'; import { Video } from '@/types/video'; + import { deletePlaylist, getVideo, detailPlaylist } from '@/app/api/playlistApi'; import Cookies from 'js-cookie'; import instructorData from '@/data/instructorData'; @@ -19,6 +16,7 @@ import { devConsoleError } from '@/utils/logger'; import TeacherTabs from './TeacherTap'; import TeacherVideoList from './TeacherVideolist'; import Modal from './Modal'; + const TeacherPlaylistPage = () => { const router = useRouter(); const searchParams = useSearchParams(); @@ -30,6 +28,7 @@ const TeacherPlaylistPage = () => { const [showModal, setShowModal] = useState(false); const [selectVideo, setSelectVideo] = useState(null); const [playlists, setPlaylists] = useState(undefined); + const token = Cookies.get('token'); const handleTeacherSelect = (inst: (typeof instructorData)[number]) => { @@ -82,6 +81,7 @@ const TeacherPlaylistPage = () => { const detail = await detailPlaylist(playlist.playlistId, token); return { ...playlist, + videos: detail && detail.videos && Array.isArray(detail.videos) ? detail.videos : [], }; } catch (detailError) { @@ -112,9 +112,11 @@ const TeacherPlaylistPage = () => { } if (!token) return; + try { await deletePlaylist(playlistId, token); alert('재생목록이 삭제되었습니다.'); + setPlaylists((prevPlaylists: PlayLists | undefined) => prevPlaylists ? { @@ -140,6 +142,7 @@ const TeacherPlaylistPage = () => { selected={selected} onSelectTeacher={handleTeacherSelect} /> + { selectedTeacherName={selected.name} token={token} onOpenModal={openModal} - /> \ No newline at end of file + /> + + {showModal && ( + + )} + + ); +}; + +export default TeacherPlaylistPage; diff --git a/front-end/src/styles/pages/login/login.scss b/front-end/src/styles/pages/login/login.scss index fec28bf7..34c3fad9 100644 --- a/front-end/src/styles/pages/login/login.scss +++ b/front-end/src/styles/pages/login/login.scss @@ -76,7 +76,6 @@ display: flex; justify-content: center; align-items: center; - height: 20vh; width: 100%; button { border-radius: 0.5rem; @@ -104,7 +103,7 @@ .googleLogin { display: flex; width: 18%; - height: 6vh; + height: auto; justify-content: center; align-items: center; margin: 0 auto; @@ -113,6 +112,8 @@ font-size: 1.5rem; font-weight: bold; border-radius: 2rem; + padding-top: 1rem; + padding-bottom: 1rem; .googleIcon { width: 2rem; margin-right: 2rem; @@ -121,7 +122,9 @@ .naverLogin { display: flex; width: 18%; - height: 6vh; + height: auto; + padding-top: 1rem; + padding-bottom: 1rem; justify-content: center; align-items: center; margin: 1rem auto; @@ -131,4 +134,10 @@ font-weight: bold; border-radius: 2rem; } + .error-message { + color: red; + display: flex; + justify-content: center; + margin-bottom: 1rem; + } } diff --git a/front-end/src/styles/pages/playlist/playlist.scss b/front-end/src/styles/pages/playlist/playlist.scss index 412074e8..f249b67a 100644 --- a/front-end/src/styles/pages/playlist/playlist.scss +++ b/front-end/src/styles/pages/playlist/playlist.scss @@ -58,30 +58,43 @@ margin-bottom: 1rem; justify-content: space-between; .remove-video-button { - color: white; - font-size: 1.2rem; + font-size: 1.5rem; display: flex; align-items: center; margin-left: 0.8rem; + width: 2.2rem; + height: 2.2rem; background-color: red; - width: 1.5rem; justify-content: center; - height: 1.5rem; border-radius: 5px; - padding: 10px; + span { + display: flex; + align-items: center; + justify-content: center; + color: white; + position: relative; + top: -6%; + } } .add-video-button { color: white; + height: 2.2rem; font-size: 1.5rem; display: flex; align-items: center; margin-left: 0.8rem; - width: 1.5rem; + width: 2.2rem; background-color: var(--btn-color); justify-content: center; border-radius: 5px; - height: 1.5rem; - padding: 10px; + span { + display: flex; + align-items: center; + justify-content: center; + color: white; + position: relative; + top: -5%; + } } input { width: 2rem; @@ -221,9 +234,9 @@ } } - .inner { - // padding: 10rem 0; - } + // .inner { + // // padding: 10rem 0; + // } .dev_list_cont { width: 100%; @include pc_1280 {