[Fix] 과제 제출 관련 버그 수정 (#155)

* fix: 레포지토리 입력 모달 버튼 이후에는 무조건 모달 닫기

* fix: 수강 신청한 스터디 가 없을 때는 empty 컴포넌ㅌ 보여주기

* feat: 제출 완료 버튼 누르면 dashboard data 새로 fetch, revalidateTagByName async 바꾸기

* feat: await 추가

apps/admin/utils/revalidateTagByName.ts

@@ -2,6 +2,6 @@
 
 import { revalidateTag } from "next/cache";
 
-export const revalidateTagByName = (tag: string) => {
+export const revalidateTagByName = async (tag: string) => {
   revalidateTag(tag);
 };

apps/client/app/(afterLogin)/my-study/my-assignment/_components/AssignmentContent/AssignmentOverviewBox/AssignmentBoxButtons.tsx

@@ -2,6 +2,7 @@
 
 import { Space } from "@wow-class/ui";
 import { padWithZero, parseISODate } from "@wow-class/utils";
+import { studyDetailApi } from "apis/studyDetailApi";
 import { studyHistoryApi } from "apis/studyHistoryApi";
 import { tags } from "constants/tags";
 import Link from "next/link";
@@ -16,12 +17,14 @@ interface AssignmentBoxButtonsProps {
   assignment: Assignment;
   repositoryLink?: string;
   buttonsDisabled?: boolean;
+  studyId: number;
 }
 
 export const AssignmentBoxButtons = ({
   buttonsDisabled,
   assignment,
   repositoryLink,
+  studyId,
 }: AssignmentBoxButtonsProps) => {
   return (
     <>
@@ -34,6 +37,8 @@ export const AssignmentBoxButtons = ({
       <SecondaryButton
         assignment={assignment}
         buttonsDisabled={buttonsDisabled}
+        key={assignment.assignmentSubmissionStatus}
+        studyId={studyId}
       />
     </>
   );
@@ -42,7 +47,7 @@ const PrimaryButton = ({
   assignment,
   buttonsDisabled,
   repositoryLink,
-}: AssignmentBoxButtonsProps) => {
+}: Omit<AssignmentBoxButtonsProps, "studyId">) => {
   const { assignmentSubmissionStatus, submissionFailureType, submissionLink } =
     assignment;
   const { primaryButtonText } =
@@ -77,9 +82,11 @@ const PrimaryButton = ({
 const SecondaryButton = ({
   assignment,
   buttonsDisabled,
+  studyId,
 }: Omit<AssignmentBoxButtonsProps, "repositoryLink">) => {
   const { assignmentSubmissionStatus, studyDetailId, deadline, committedAt } =
     assignment;
+
   if (isDeadlinePassed(deadline)) {
     return (
       <Button disabled={true} style={buttonStyle}>
@@ -92,12 +99,28 @@ const SecondaryButton = ({
       ? buttonTextMap.INITIAL
       : buttonTextMap[assignmentSubmissionStatus];
 
+  const fetchStudyDashboard = async () => {
+    const studyDashboard =
+      await studyDetailApi.getStudyDetailDashboard(studyId);
+    return studyDashboard;
+  };
+
   const handleClickSubmissionComplete = async () => {
     const response = await studyHistoryApi.submitAssignment(studyDetailId);
     if (response.success) {
-      revalidateTagByName(tags.studyDetailDashboard);
-      revalidateTagByName(tags.studyHistory);
-      toast.success("과제 제출이 완료되었어요.");
+      await revalidateTagByName(tags.studyDetailDashboard);
+      await revalidateTagByName(tags.studyHistory);
+      const fetchedStudyDashBoardData = await fetchStudyDashboard();
+      const currentAssignmentSubmissionStatus =
+        fetchedStudyDashBoardData?.submittableAssignments.filter(
+          (item) => item.studyDetailId === studyDetailId
+        )[0]?.assignmentSubmissionStatus;
+
+      if (currentAssignmentSubmissionStatus === "SUCCESS") {
+        toast.success("과제 제출이 완료되었습니다.");
+      } else if (currentAssignmentSubmissionStatus === "FAILURE") {
+        toast.error("과제 제출에 실패했습니다.");
+      }
     }
   };
 
@@ -106,6 +129,7 @@ const SecondaryButton = ({
     committedAt as string
   );
   const commitText = `최종 수정일자 ${year}년 ${month}월 ${day}일 ${padWithZero(hours)}:${padWithZero(minutes)}`;
+
   return (
     <Button
       disabled={buttonsDisabled}

apps/client/app/(afterLogin)/my-study/my-assignment/_components/AssignmentContent/AssignmentOverviewBox/index.tsx

@@ -66,6 +66,7 @@ export const AssignmentOverviewBox = async ({
                   assignment={assignment}
                   buttonsDisabled={buttonsDisabled || !isSubmittable}
                   repositoryLink={repositoryLink}
+                  studyId={myOngoingStudyInfoData.studyId}
                 />
               </>
             }

apps/client/app/(afterLogin)/my-study/my-assignment/_components/AssignmentContent/RepositorySubmissionBox.tsx

@@ -95,8 +95,8 @@ export const RepositorySubmissionBox = ({
     if (success) {
       revalidateTagByName(tags.studyDetailDashboard);
       setRepositorySubmissionStatus("SUBMITTED");
-      onClose();
     }
+    onClose();
   };
 
   return (

apps/client/app/(afterLogin)/study-apply/@modal/(.)study-application/[studyId]/page.tsx

@@ -49,8 +49,8 @@ const StudyApplication = ({ params }: { params: { studyId: number } }) => {
   const handleClickApplyButton = async () => {
     const result = await studyApplyApi.applyStudy(Number(studyId));
     if (result.success) {
-      revalidateTagByName(tags.studyApply);
-      revalidateTagByName(tags.myOngoingStudy);
+      await revalidateTagByName(tags.studyApply);
+      await revalidateTagByName(tags.myOngoingStudy);
       setApplySuccess(true);
     }
   };

apps/client/app/(afterLogin)/study-apply/@modal/(.)study-cancellation/[studyId]/page.tsx

@@ -50,8 +50,8 @@ const StudyCancel = ({ params }: { params: { studyId: number } }) => {
     const result = await studyApplyApi.cancelStudyApplication(Number(studyId));
 
     if (result.success) {
-      revalidateTagByName(tags.studyApply);
-      revalidateTagByName(tags.myOngoingStudy);
+      await revalidateTagByName(tags.studyApply);
+      await revalidateTagByName(tags.myOngoingStudy);
       setCancelSuccess(true);
     }
   };

apps/client/app/(afterLogin)/study-apply/_components/EmptyStudyApplication.tsx

@@ -0,0 +1,27 @@
+import { Flex } from "@styled-system/jsx";
+import { Text } from "@wow-class/ui";
+import Image from "next/image";
+
+const EmptyStudyApplication = () => {
+  return (
+    <Flex
+      alignItems="center"
+      direction="column"
+      gap="xl"
+      justifyContent="center"
+      minHeight="calc(100vh - 108px)"
+    >
+      <Image
+        alt="empty-study"
+        height={140}
+        src="/images/empty.svg"
+        width={186}
+      />
+      <Text as="h2" color="sub" typo="h2">
+        현재 수강할 수 있는 스터디가 없어요
+      </Text>
+    </Flex>
+  );
+};
+
+export default EmptyStudyApplication;

apps/client/app/(afterLogin)/study-apply/page.tsx

@@ -1,6 +1,7 @@
 import { Space, Text } from "@wow-class/ui";
 import { studyApplyApi } from "apis/studyApplyApi";
 
+import EmptyStudyApplication from "./_components/EmptyStudyApplication";
 import StudyItem from "./_components/StudyItem";
 
 const StudyApplyPage = async () => {
@@ -16,13 +17,17 @@ const StudyApplyPage = async () => {
         신청 가능한 스터디
       </Text>
       <Space height={19} />
-      {studyList?.map((study) => (
-        <StudyItem
-          appliedStudyId={appliedStudyId}
-          key={study.studyId}
-          study={study}
-        />
-      ))}
+      {studyList.length > 0 ? (
+        studyList.map((study) => (
+          <StudyItem
+            appliedStudyId={appliedStudyId}
+            key={study.studyId}
+            study={study}
+          />
+        ))
+      ) : (
+        <EmptyStudyApplication />
+      )}
     </>
   );
 };

apps/client/utils/revalidateTagByName.ts

@@ -2,6 +2,6 @@
 
 import { revalidateTag } from "next/cache";
 
-export const revalidateTagByName = (tag: string) => {
+export const revalidateTagByName = async (tag: string) => {
   revalidateTag(tag);
 };