feat: 수강신청 중(onPending) 시 수강 신청을 막는 기능 추가

frontend/src/components/ClassInfo/ClassInfo.jsx

@@ -1,6 +1,6 @@
 import styles from './ClassInfo.module.css';
 
-export default function ClassInfo({ classTerm, classTime, onSubmit }) {
+export default function ClassInfo({ classTerm, classTime, onPending = false, onSubmit }) {
   return (
     <div className={styles.classInfo}>
       <div className={styles.title}>수업정보</div>
@@ -17,8 +17,9 @@ export default function ClassInfo({ classTerm, classTime, onSubmit }) {
       <button
         onClick={onSubmit}
         className={styles.button}
+        disabled={onPending}
       >
-        수강신청
+        {onPending ? '수강신청 중' : '수강신청'}
       </button>
     </div>
   );

frontend/src/components/ClassInfo/ClassInfo.module.css

@@ -55,3 +55,11 @@
   color: var(--on-primary);
   cursor: pointer;
 }
+
+.button:disabled {
+  border-color: var(--border-color);
+  background-color: var(--background-tertiary);
+  color: var(--text-color-tertiary);
+  cursor: not-allowed;
+  stroke: var(--text-color-tertiary);
+}

frontend/src/pages/LectureInfoPage/LectureInfoPage.jsx

@@ -16,6 +16,7 @@ export default function LectureInfoPage() {
   const endDate = new Date(lectureData.endDate).toLocaleDateString();
   const userType = useBoundStore((state) => state.userType);
   console.log(lectureData);
+  const onPending = lectureData.status === 'PENDING' ? true : false;
   const { lectureRegister } = useLectureRegister();
   const handleSubmit = () => {
     if (userType === null) {
@@ -58,6 +59,7 @@ export default function LectureInfoPage() {
             classTerm={`${startDate} ~ ${endDate}`}
             classTime={lectureData.time}
             onSubmit={handleSubmit}
+            onPending={onPending}
           />
         </aside>
       </MaxWidthLayout>