#27 refactor: 강의 상세 페이지 리펙토링

src/App.tsx

@@ -1,18 +1,29 @@
-import {BrowserRouter, Routes, Route} from 'react-router-dom';
+import {BrowserRouter, Routes, Route, useLocation} from 'react-router-dom';
 import Layout from './layout/Layout';
 import LandingPage from './pages/common/LandingPage';
 import UserIdInputPage from './pages/common/UserIdInputPage';
 import Dashboard from './pages/common/Dashboard';
 import AssignmentsPage from './pages/admin/assignments/AssignmentsPage';
 import AssignmentSelectPage from './pages/admin/assignments/AssignmentSelectPage';
-import CourseOverviewPage from './pages/common/CourseOverviewPage';
+import CourseOverviewPage from './pages/course-overview/CourseOverviewPage';
 import AssignmentCreatePage from './pages/admin/assignments/AssignmentCreatePage';
 import CourseCreatePage from './pages/admin/courses/CourseCreatePage';
 import StudentManagementPage from './pages/admin/student/studentManagementPage';
+import type {UserType} from './models/common';
+import {createContext} from 'react';
+
+export const UserTypeContext = createContext<UserType>('guest');
+
+const AppContent = () => {
+  const pathname = useLocation().pathname;
+  const userType = pathname.startsWith('/admin')
+    ? 'admin'
+    : pathname.startsWith('/student')
+      ? 'student'
+      : 'guest';
 
-function App() {
   return (
-    <BrowserRouter>
+    <UserTypeContext.Provider value={userType}>
       <Routes>
         {/* 공통 영역 */}
         <Route path='/' element={<Layout />}>
@@ -39,6 +50,14 @@ function App() {
           <Route path='student' element={<StudentManagementPage />} />
         </Route>
       </Routes>
+    </UserTypeContext.Provider>
+  );
+};
+
+function App() {
+  return (
+    <BrowserRouter>
+      <AppContent />
     </BrowserRouter>
   );
 }

src/components/admin/assignments/AssignmentCard.tsx

@@ -1,8 +1,8 @@
 import {useState} from 'react';
-import SingleEllipsisIcon from '/svg/singleEllipsisIcon.svg?react';
-import DragAndDropIcon from '/svg/dragAndDropIcon.svg?react';
-import DeleteIcon from '/svg/deleteIcon.svg?react';
-import EditIcon from '/svg/editIcon.svg?react';
+import SingleEllipsisIcon from '@/assets/svg/singleEllipsisIcon.svg?react';
+import DragAndDropIcon from '@/assets/svg/dragAndDropIcon.svg?react';
+import DeleteIcon from '@/assets/svg/deleteIcon.svg?react';
+import EditIcon from '@/assets/svg/editIcon.svg?react';
 import type {Assignment} from './dummy/types';
 
 interface AssignmentCardProps extends Assignment {

src/components/admin/assignments/AssignmentPageLayout.tsx

@@ -2,7 +2,7 @@ import CourseSelector from './CourseSelector';
 import AssignmentList from './AssignmentList';
 import Button from '@/components/common/Button';
 import type {Course} from './dummy/types';
-import AddIcon from '/svg/addIcon.svg?react';
+import AddIcon from '@/assets/svg/addIcon.svg?react';
 import {useState} from 'react';
 
 interface AssignmentPageLayoutProps {

src/components/admin/assignments/CourseSelector.tsx

@@ -1,5 +1,5 @@
 import {useState} from 'react';
-import ArrowdownIcon from '/svg/arrowdownIcon.svg?react';
+import ArrowdownIcon from '@/assets/svg/arrowdownIcon.svg?react';
 import type {Course} from './dummy/types';
 
 interface CourseSelectorProps {

src/components/admin/form/FileUpload.tsx

@@ -1,6 +1,6 @@
 import {useRef, useState} from 'react';
 import type {ChangeEvent} from 'react';
-import FileIcon from '/svg/file.svg?react';
+import FileIcon from '@/assets/svg/file.svg?react';
 
 type FileUploadProps = {
   label: string;

src/components/admin/form/LabeledDropdown.tsx

@@ -1,5 +1,5 @@
 import {useState, useRef} from 'react';
-import Chevrondown from '/svg/chevrondown.svg?react';
+import Chevrondown from '@/assets/svg/chevrondown.svg?react';
 import useClickOutside from '@/hooks/useClickOutside';
 
 interface LabeledDropdownProps

src/components/common/Badge.tsx

@@ -1,5 +1,7 @@
 import {tv, type VariantProps} from 'tailwind-variants/lite';
-import {Correct, Incorrect, Unsubmitted} from '@/assets/svg';
+import Correct from '@/assets/svg/correct.svg?react';
+import Incorrect from '@/assets/svg/incorrect.svg?react';
+import Unsubmitted from '@/assets/svg/unsubmitted.svg?react';
 
 const badgeStyles = tv({
   base: 'rounded-full px-3.5 py-1.5 leading-[19px] text-center text-base font-medium border whitespace-nowrap',
@@ -18,7 +20,7 @@ const scheduleBadgeStyles = tv({
 
 const submissionBadgeStyles = tv({
   extend: badgeStyles,
-  base: 'bg-transparent flex-center gap-2',
+  base: 'bg-transparent flex-center gap-2 text-sm',
   variants: {
     status: {
       CORRECT: 'border-primary text-primary',