[FIX] 올바르게 출석 상태에 따라서 출석 버튼이 활성화 되지 않던 버그 수정 (#155)

기존에 아직 출석이 가능한 상태도 아님에도 불구하고 출석하기 버튼이 활성화 되는 버그가 존재하였습니다 이에 올바르게 해당 로직을 수정하였습니다
JNU-econovation · Dec 6, 2024 · 1c77033 · 1c77033
2 parents 0d8d357 + 217c7d7
commit 1c77033
Show file tree

Hide file tree

Showing 4 changed files with 220 additions and 31 deletions.
diff --git a/FE/src/components/feature/detail/userAttendModal/UserAttendModal.tsx b/FE/src/components/feature/detail/userAttendModal/UserAttendModal.tsx
@@ -8,9 +8,8 @@ import {
   useGetMyAttendStatus,
   usePostMyAttendance,
 } from "@/hooks/query/useUserQuery";
-import { EditableStatus } from "@/types/attendStatusModal";
-import { AttendStatus } from "@/types/member";
 import { ProgramAttendStatus, ProgramStatus } from "@/types/program";
+import { getEditableStatus } from "@/utils/program";
 
 interface UserAttendModalProps {
   programId: number;
@@ -33,34 +32,11 @@ const UserAttendModal = ({ programId }: UserAttendModalProps) => {
     programId,
   ]);
 
-  const getEditableStatus = (
-    attendStatus: AttendStatus,
-    programAttendMode: ProgramAttendStatus,
-    programStatus: ProgramStatus,
-  ): EditableStatus => {
-    if (attendStatus === "nonRelated") {
-      return "NON_RELATED";
-    }
-    if (programStatus === "active") {
-      // 당일날에
-      if (programAttendMode === "attend" || programAttendMode === "late") {
-        // 출석 중이면
-        if (attendStatus === "attend" || attendStatus === "late")
-          // 내 상태가 참석 또는 지각이면
-          return "ALREADY_ATTENDED"; // 변경 불가
-
-        return "EDITABLE"; //내 상태가 없다면 변경 가능
-      }
-      if (programAttendMode === "end") return "NON_RELATED"; // 당일날 종료되었으면 변경 불가
-    }
-    return "INACTIVE"; // 당일날이 아니면 변경 불가
-  };
-
-  const editableStatus = getEditableStatus(
-    attendStatus,
-    attendMode,
-    programStatus,
-  );
+  const editableStatus = getEditableStatus({
+    myAttendStatus: attendStatus,
+    programStatus: programStatus,
+    programAttendMode: attendMode,
+  });
 
   const handleSelectorClick = () => {
     if (editableStatus === "EDITABLE")

diff --git a/FE/src/constants/ATTEND_STATUS.ts b/FE/src/constants/ATTEND_STATUS.ts
@@ -94,7 +94,8 @@ const USER: AttendStatusUser = {
 const LABEL = {
   EDITABLE: "출석 하시겠습니까?",
   NON_RELATED: "출석 상태를 변경할 수 없습니다.",
-  INACTIVE: "종료된 행사는 출석 상태를 변경할 수 없습니다.",
+  // INACTIVE: "종료된 행사는 출석 상태를 변경할 수 없습니다.",
+  INACTIVE: "지금은 출석 기간이 아닙니다.",
   ALREADY_ATTENDED: "출석은 한 번만 가능합니다.",
 };
 

diff --git a/FE/src/utils/__test__/program.test.ts b/FE/src/utils/__test__/program.test.ts
@@ -0,0 +1,179 @@
+import { AttendStatus } from "@/types/member";
+import { getEditableStatus } from "../program";
+import { ProgramAttendStatus, ProgramStatus } from "@/types/program";
+
+describe("getEditableStatus", () => {
+  let myAttendStatus: AttendStatus;
+  let programStatus: ProgramStatus;
+  let programAttendMode: ProgramAttendStatus;
+
+  describe("행사 당일날", () => {
+    describe("프로그램이 진행 중인 경우", () => {
+      it("내 출석 상태가 미응답인 경우 EDITABLE를 반환한다", () => {
+        // when
+        programStatus = "active";
+        programAttendMode = "attend";
+        myAttendStatus = "nonResponse";
+
+        // then
+        const editableStatus = getEditableStatus({
+          myAttendStatus,
+          programStatus,
+          programAttendMode,
+        });
+
+        expect(editableStatus).toBe("EDITABLE");
+      });
+      it("이미 응답을 한 경우 ALREADY_ATTENDED를 반환한다.", () => {
+        // given
+        programStatus = "active";
+        programAttendMode = "attend";
+
+        // when
+        myAttendStatus = "attend";
+
+        // then
+        const editableStatus = getEditableStatus({
+          myAttendStatus,
+          programStatus,
+          programAttendMode,
+        });
+
+        expect(editableStatus).toBe("ALREADY_ATTENDED");
+
+        // when
+        programAttendMode = "late";
+
+        // then
+        const editableStatus2 = getEditableStatus({
+          myAttendStatus,
+          programStatus,
+          programAttendMode,
+        });
+
+        expect(editableStatus2).toBe("ALREADY_ATTENDED");
+      });
+      it("나와 관련이 없는 행사인 경우 NON_RELATED를 반환한다.", () => {
+        // when
+        programStatus = "active";
+        programAttendMode = "attend";
+        myAttendStatus = "nonRelated";
+
+        // then
+        const editableStatus = getEditableStatus({
+          myAttendStatus,
+          programStatus,
+          programAttendMode,
+        });
+
+        expect(editableStatus).toBe("NON_RELATED");
+      });
+    });
+    it("프로그램이 진행중이지 않은 경우 INACTIVE를 반환한다.", () => {
+      // 프로그램 시작 날짜 이전인 경우
+      // given
+      programStatus = "end";
+
+      // when
+      programAttendMode = "end";
+      myAttendStatus = "nonResponse";
+
+      // then
+      let editableStatus = getEditableStatus({
+        myAttendStatus,
+        programStatus,
+        programAttendMode,
+      });
+      expect(editableStatus).toBe("INACTIVE");
+
+      // 프로그램 종료 날짜 이후인 경우
+      // when
+      programAttendMode = "end";
+      myAttendStatus = "attend";
+
+      // then
+      editableStatus = getEditableStatus({
+        myAttendStatus,
+        programStatus,
+        programAttendMode,
+      });
+      expect(editableStatus).toBe("INACTIVE");
+
+      // when
+      programAttendMode = "end";
+      myAttendStatus = "late";
+
+      // then
+      editableStatus = getEditableStatus({
+        myAttendStatus,
+        programStatus,
+        programAttendMode,
+      });
+      expect(editableStatus).toBe("INACTIVE");
+
+      // when
+      programAttendMode = "end";
+      myAttendStatus = "absent";
+
+      // then
+      editableStatus = getEditableStatus({
+        myAttendStatus,
+        programStatus,
+        programAttendMode,
+      });
+      expect(editableStatus).toBe("INACTIVE");
+    });
+  }),
+    it("행사 당일이 아닌 날인 경우 INACTIVE를 반환한다", () => {
+      // given
+      programStatus = "end";
+      programAttendMode = "end";
+
+      // when
+      myAttendStatus = "absent";
+
+      // then
+      let editableStatus = getEditableStatus({
+        myAttendStatus,
+        programStatus,
+        programAttendMode,
+      });
+      expect(editableStatus).toBe("INACTIVE");
+
+      // when
+      myAttendStatus = "attend";
+
+      // then
+      editableStatus = getEditableStatus({
+        myAttendStatus,
+        programStatus,
+        programAttendMode,
+      });
+      expect(editableStatus).toBe("INACTIVE");
+
+      // when
+      myAttendStatus = "late";
+
+      // then
+      editableStatus = getEditableStatus({
+        myAttendStatus,
+        programStatus,
+        programAttendMode,
+      });
+      expect(editableStatus).toBe("INACTIVE");
+    });
+  it("나와 관련이 없는 행사인 경우 NON_RELATED를 반환한다.", () => {
+    //when
+    programStatus = "active";
+    programAttendMode = "attend";
+    myAttendStatus = "nonRelated";
+
+    //then
+    const editableStatus = getEditableStatus({
+      myAttendStatus,
+      programStatus,
+      programAttendMode,
+    });
+    expect(editableStatus).toBe("NON_RELATED");
+  });
+});
diff --git a/FE/src/utils/program.ts b/FE/src/utils/program.ts
@@ -0,0 +1,33 @@
+import { EditableStatus } from "@/types/attendStatusModal";
+import { AttendStatus } from "@/types/member";
+import { ProgramAttendStatus, ProgramStatus } from "@/types/program";
+
+export const getEditableStatus = ({
+  myAttendStatus,
+  programStatus,
+  programAttendMode,
+}: {
+  myAttendStatus: AttendStatus; // 내 출결 상태
+  programStatus: ProgramStatus; // 프로그램 상태
+  programAttendMode: ProgramAttendStatus; // 프로그램 출석 모드
+}): EditableStatus => {
+  if (
+    programStatus === "active" &&
+    myAttendStatus === "nonResponse" &&
+    (programAttendMode === "attend" || programAttendMode === "late")
+  )
+    return "EDITABLE";
+
+  if (myAttendStatus === "nonRelated") return "NON_RELATED";
+  if (programStatus === "end") return "INACTIVE";
+  if (
+    programStatus === "active" &&
+    (myAttendStatus === "attend" ||
+      myAttendStatus === "late" ||
+      myAttendStatus === "absent") &&
+    (programAttendMode === "attend" || programAttendMode === "late")
+  )
+    return "ALREADY_ATTENDED";
+
+  return "INACTIVE";
+};