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 {