[ Refactor/problem 94 ] 문제풀이 페이지 model 구현

[Happhee]

🔥 Related Issues

resolve #94
close #94

💜 작업 내용

• 컴포넌트에 모여있던 비즈니스 로직을 model로 분리
• 커스텀훅 형태로 model 계층 구현

✅ PR Point

useAnswerChoiceModel

• 문제 선지에 대한 비즈니스 로직을 관리하는 모델입니다.

// 선지 클래스 명 반환
 const getAnswerChoiceButtonClassName = () => {
    if (INIT_CHOICE_ANSWER)
      return ANSWER_CHOICHE_BUTTON_INFO.INIT_CHOICE_ANSWER;

    if (CURRENT_CHOICE_ANSWER)
      return ANSWER_CHOICHE_BUTTON_INFO.CURRENT_CHOICE_ANSWER;

    if (CHOICE_ANSWER_CORRECT)
      return ANSWER_CHOICHE_BUTTON_INFO.CHOICE_ANSWER_CORRECT;

    if (CHOICE_ANSWER_FAIL)
      return ANSWER_CHOICHE_BUTTON_INFO.CHOICE_ANSWER_FAIL;

    return ANSWER_CHOICHE_BUTTON_INFO.INIT_CHOICE_ANSWER;
  };
// 동그라미 채울지여부판단
  const isChoiceFillCircle = () => {
    if (INIT_CHOICE_ANSWER) return false;
    if (!CURRENT_CHOICE_ANSWER && !CHOICE_ANSWER_CORRECT && !CHOICE_ANSWER_FAIL)
      return false;
    return true;
  };

// 동그라미 원 색깔 반환
  const getChoiceFillColor = () => {
    if (INIT_CHOICE_ANSWER) return "#A5A5A5";
    if (CURRENT_CHOICE_ANSWER) return "white";
    if (CHOICE_ANSWER_CORRECT) return "#0166B3";
    if (CHOICE_ANSWER_FAIL) return "#B00020";
    return "#A5A5A5";
  };

// 문제 제출한지 여부 판단
  const isProblemAnswerInfo = () => {
    return Boolean(problemAnswerInfo);
  };

useAnswerSubmitModel

• 문제 풀이 하단 버튼에 대한 비즈니스 로직을 관리하는 모델입니다.

// 하단 버튼 속성 반환
const getAnswerSubmitButtonInfo = () => {
    if (BEFORE_CHOICHE_ANSWER) return BUTTON_INFO.PRE_ANSWER_SELECT;

    if (POST_ANSWER_SUBMIT) return BUTTON_INFO.POST_SUBMIT;

    if (POST_ANSWER_PRE_SUBMIT) return BUTTON_INFO.POST_ANSWER_PRE_SUBMIT;

    if (LAST_PROBLEM_LINK_TO_MAIN) return BUTTON_INFO.LINK_TO_MAIN;
  };

// 문제풀이 버튼 상태 반환
  const getAnswerButtonState = () => {
    if (POST_ANSWER_PRE_SUBMIT) return BUTTON_STATE[0];

    if (POST_ANSWER_SUBMIT) return BUTTON_STATE[2];

    if (LAST_PROBLEM_LINK_TO_MAIN) return BUTTON_STATE[3];
  };

[soomin9106]

오!! 비즈니스 로직을 한 번에 model 로 분리하니까 깔끔하네요 !! 👍

[soomin9106]

이게 왜 함수 형태로 되었나용?!

[Happhee]

model에서 만드는 비즈니스 로직들을 일단 다 함수로 만들고있긴해서 통일성을 지키려다보니 함수가 되었습니다. 혹시 더 좋은 의견이 있을까요?

[soomin9106]

로직을 분리하니까 확실히 깔끔하네용!!

[soomin9106]

models 폴더 위치는
problem/models 같은 폴더 구조로 가져가는거죵??
좋습니다!!

[Happhee]

네네! 문제페이지에서만 사용하는 모델이라 해당 폴더에 넣었습니다!

[Happhee]

@soomin9106 모델 class로 수정한 commit 입니다!

[soomin9106]

오 굿굿 좋습니다 👍