[PR] 과제 업로드 로딩 페이지(UploadLoadingPage) 리펙토링

[TTOCHIwas]

📌 요약 (Summary)

업로드 로딩 페이지의 로직과 화면을 분리해서 구조를 정리했습니다.
페이지는 더 단순하게 만들고, 로딩 진행 상태 계산은 hook으로, 화면은 section으로 나눴습니다.

✅ 주요 변경 사항 (Key Changes)

• UploadLoadingPage에서 로딩 진행 로직을 useUploadLoadingProgress로 분리했습니다.
• 로딩 화면 UI를 UploadLoadingSection으로 분리했습니다.
• page는 hook 호출과 section 만 사용하도록 했습니다.

🛠 상세 구현 내용 (Implementation Details)

1. 로딩 진행 로직 분리

• useUploadLoadingProgress로 분리했습니다.
  • 업로드 진행률 계산
  • 현재 단계 메시지 계산
  • projectId가 생기면 업로드 step 페이지로 이동
  • error가 생기면 업로드 페이지로 이동

2. 로딩 화면 UI 분리

• 로딩 화면에 있던 JSX를 UploadLoadingSection으로 분리했습니다.
• progress와 currentStepMessage값만 받아서 화면을 그립니다.

3. 페이지 역할 단순화

• UploadLoadingPage는 직접 로직을 처리하지 않고,
  • useUploadLoadingProgress를 호출하고
  • UploadLoadingSection을 보여주는 역할만 합니다.

🚨 트러블 슈팅 (Trouble Shooting)

해당 없음

📎 알려진 이슈 및 참고 사항 (Known Issues & Notes)

• 현재 로딩 페이지는 useUploadFlowStore의 projectId를 기준으로 동작합니다.
• 그래서 새로고침하거나 /upload/loading에 직접 들어오면 projectId가 없어서, 진행률이 올라가다가 멈춘 상태처럼 보일 수 있습니다.
• 다음 이슈에서
  • 새로고침 대응
  • 직접 진입 방어
  • projectId 복구 방식
    을 검토하여 개선하겠습니다.

🖼 스크린샷 (Screenshots)

해당 없음

#️⃣ 관련 이슈 (Related Issues)

• 과제 업로드 로딩 페이지(UploadLoadingPage) 리펙토링 #55

[gemini-code-assist]

Code Review

This pull request refactors the UploadLoadingPage by extracting its state management logic into a new custom hook, useUploadLoadingProgress, and its UI into the UploadLoadingSection component. The reviewer provided several constructive suggestions to improve the code quality, including optimizing the progress timer by preventing unnecessary intervals when a projectId is present, replacing various magic numbers with descriptive constants, and moving the reversal of the LOADING_STEPS array outside of the useMemo hook to avoid redundant computations.