Skip to content

revert: PR #83 홈 진행중인 사건 API 연동 및 UI 수정 되돌리기 - #84

Merged
evenif99 merged 1 commit into
devfrom
revert-83-fix/active-cases-home
Jun 20, 2026
Merged

evenif99 merged 1 commit into
devfrom
revert-83-fix/active-cases-home

Conversation

@wjdalss21

@wjdalss21 wjdalss21 commented Jun 20, 2026 •

Copy link
Copy Markdown
Collaborator

팀장 승인 없이 dev에 머지된 PR #83을 되돌립니다.

Summary by CodeRabbit

릴리스 노트

  • 버그 수정

    • 사건 참여자 정보에서 닉네임 필드 제거
  • 기능 변경

    • 사건 목록 조회 시 진행 중 상태 자동 필터링 제거
    • 새 사건 생성 요청 타임아웃 단축 (30초 → 5초)
  • 스타일

    • 일기 박스 최대 너비 제한 추가

@vercel

vercel Bot commented Jun 20, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
talky-owl Ready Ready Preview, Comment Jun 20, 2026 2:36am

@coderabbitai

coderabbitai Bot commented Jun 20, 2026 •

Copy link
Copy Markdown
Contributor

Review Change Stack

📝 Walkthrough

Walkthrough

DisputeParticipantDto에서 nickname 필드를 제거하고, 두 disputes API 라우트의 toParticipantDto 매핑에서 관련 할당을 삭제합니다. GET /api/disputes의 active 쿼리 파라미터 기반 상태 필터링 로직이 제거되고, useActiveCases의 실제 fetch 구현이 빈 배열을 반환하는 stub으로 교체됩니다. 또한 NewCaseButton의 요청 타임아웃 단축과 .diaryBox max-width 추가가 포함됩니다.

Changes

nickname 제거 및 active 필터 삭제

Layer / File(s) Summary
DisputeParticipantDto nickname 필드 제거
src/types/dispute.ts
DisputeParticipantDto에서 nickname: string | null 프로퍼티가 삭제되어 DTO 타입 계약이 변경됩니다.
API 라우트의 nickname 매핑 및 active 필터 삭제
src/app/api/disputes/route.ts, src/app/api/disputes/[id]/route.ts
두 라우트의 toParticipantDto에서 nickname: null 할당이 제거됩니다. GET /api/disputes에서 active 쿼리 파라미터 파싱, DisputeStatus import, 상태 기반 where 필터 블록이 삭제됩니다.
useActiveCases fetch 로직 stub 교체
src/hooks/useActiveCases.ts
fetchActiveCases 구현 및 DisputeDto import가 제거되고 queryFn이 빈 배열을 반환하는 stub으로 교체됩니다. ACTIVE_DISPUTE_STATUSES, ActiveDisputeStatus, RawCase 타입이 추가되며 실제 구현은 TODO로 남겨집니다.
NewCaseButton 타임아웃 단축 및 diaryBox 너비 제한
src/components/home/NewCaseButton.tsx, src/app/page.module.scss
AbortController 타임아웃이 30초에서 5초로 단축되고, .diaryBox에 max-width: 365px가 추가됩니다.

추정 코드 리뷰 노력

🎯 2 (Simple) | ⏱️ ~10 minutes

연관 가능성 있는 PR

  • I5-Project/TALKY-OWL#52: 홈의 "진행중인 사건" 섹션을 useActiveCases와 participants 렌더링에 의존해 추가한 PR로, 이번 변경의 데이터 흐름(진행중 사건/참여자 DTO)에 직접 영향을 받습니다.
  • I5-Project/TALKY-OWL#83: toParticipantDto 및 DisputeParticipantDto의 nickname 처리를 동일한 코드 경로에서 수정한 PR로, 이번 변경과 충돌 및 중첩됩니다.

시 🐰

닉네임은 사라지고, 필터도 떠나갔네 🍃
빈 배열만 돌아오는 훅, 잠시 쉬는 중
5초면 충분해, 기다림은 짧게
diaryBox도 365px 울타리 안으로
토끼가 코드를 정리하며 깡충깡충~ 🐇✨

🚥 Pre-merge checks | ✅ 3 | ❌ 2

❌ Failed checks (1 warning, 1 inconclusive)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 50.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
Description check ❓ Inconclusive PR 설명이 매우 간단하지만, revert PR의 특성상 되돌릴 대상(PR #83)과 사유(팀장 승인 없이 머지됨)를 명시했습니다. 다만 필수 템플릿의 대부분 섹션이 작성되지 않았습니다. Revert PR임을 명확히 하고, 필수 섹션(작업 내용, 관련 Issue, 변경 사항, 테스트 결과, 작업 범위 확인 등)을 템플릿에 맞춰 작성하시기 바랍니다.
✅ Passed checks (3 passed)
Check name Status Explanation
Title check ✅ Passed PR 제목이 변경 사항의 주요 의도를 명확하게 설명하며, PR #83의 되돌리기(revert)라는 핵심 목적을 잘 나타냅니다.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch revert-83-fix/active-cases-home

Comment @coderabbitai help to get the list of available commands and usage tips.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🧹 Nitpick comments (1)
src/hooks/useActiveCases.ts (1)

23-28: 💤 Low value

사용되지 않는 상수 및 타입 정의

ACTIVE_DISPUTE_STATUSES, ActiveDisputeStatus, RawCase가 정의되었지만 현재 코드에서 사용되지 않습니다. TODO 구현 전까지 불필요한 코드입니다.

♻️ 사용되지 않는 코드 제거 제안
-// 진행중인 사건 = 진술 시작 후 ~ 판결 전
-// draft(진술 전), judging(판결 처리 중), judged(판결 완료) 제외
-const ACTIVE_DISPUTE_STATUSES = ['waiting_opponent', 'opponent_joined', 'both_submitted'] as const
-type ActiveDisputeStatus = (typeof ACTIVE_DISPUTE_STATUSES)[number]
-
-type RawCase = ActiveCase & { status: ActiveDisputeStatus }
-
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@src/hooks/useActiveCases.ts` around lines 23 - 28, The constants
ACTIVE_DISPUTE_STATUSES and types ActiveDisputeStatus and RawCase are defined in
the useActiveCases.ts hook but are not currently used anywhere in the code.
Remove these unused definitions (the constant array, the type alias, and the
RawCase type) until they are needed for future implementation, as keeping unused
code adds unnecessary complexity.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/components/home/NewCaseButton.tsx`:
- Line 34: The setTimeout timeout of 5000ms is too short for the two sequential
API calls to room creation and dispute creation. The 5-second timeout can cause
premature request cancellation on slower networks or during server load.
Increase the timeout value from 5000 to at least 15000 milliseconds to provide
sufficient time for both the room creation and dispute creation API calls to
complete, or alternatively implement separate timeout mechanisms for each
individual API call to better handle their individual response times.

In `@src/hooks/useActiveCases.ts`:
- Around line 30-36: When implementing the commented-out `fetchActiveCases`
function, add a data transformation layer to map the flat
`DisputeParticipantDto[]` structure returned from the API into the nested
`Participant[]` structure expected by the component. The mapping must handle
converting the flat participants data (with userId, profileImageUrl, role at
root level) into the nested structure required by `Participant` (with user
object containing nickname and profileImageUrl). Since the `nickname` field is
not provided by the API response but is referenced in `ActiveCasesSection.tsx`
at line 63 via `p.user.nickname`, you need to either fetch user details
separately from a User API endpoint or adjust the API contract to include
nickname in the participant data. Create a mapping function that transforms each
`DisputeParticipantDto` into a `Participant` object with the correct nested
structure and resolved nickname data.

---

Nitpick comments:
In `@src/hooks/useActiveCases.ts`:
- Around line 23-28: The constants ACTIVE_DISPUTE_STATUSES and types
ActiveDisputeStatus and RawCase are defined in the useActiveCases.ts hook but
are not currently used anywhere in the code. Remove these unused definitions
(the constant array, the type alias, and the RawCase type) until they are needed
for future implementation, as keeping unused code adds unnecessary complexity.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Repository UI (base), Organization UI (inherited)

Review profile: CHILL

Plan: Pro Plus

Run ID: 68c39c23-061c-4a2f-97b2-b7256f3913b9

📥 Commits

Reviewing files that changed from the base of the PR and between 89d9c6f and 1e2d529.

📒 Files selected for processing (6)
  • src/app/api/disputes/[id]/route.ts
  • src/app/api/disputes/route.ts
  • src/app/page.module.scss
  • src/components/home/NewCaseButton.tsx
  • src/hooks/useActiveCases.ts
  • src/types/dispute.ts
💤 Files with no reviewable changes (2)
  • src/types/dispute.ts
  • src/app/api/disputes/[id]/route.ts

const controller = new AbortController()
// 방 생성 + 사건 생성 두 번의 순차 API 호출을 커버할 수 있도록 30초로 설정
const timeout = setTimeout(() => controller.abort(), 30000)
const timeout = setTimeout(() => controller.abort(), 5000)

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟠 Major | ⚡ Quick win

타임아웃이 연속된 두 API 호출에 비해 지나치게 짧습니다.

5초 타임아웃은 room 생성(36-43행)과 dispute 생성(45-52행) 두 개의 순차적 API 호출을 완료하기에 너무 짧습니다. 느린 네트워크 환경, 서버 부하 상황, 또는 콜드 스타트 시 정상적인 요청도 중단될 수 있어 사용자에게 불필요한 오류 메시지가 표시됩니다.

최소 15,000ms 이상으로 늘리거나, 각 API 호출마다 개별 타임아웃을 설정하는 것을 권장합니다.

⏱️ 타임아웃 증가 제안
-    const timeout = setTimeout(() => controller.abort(), 5000)
+    const timeout = setTimeout(() => controller.abort(), 15000)
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
const timeout = setTimeout(() => controller.abort(), 5000)
const timeout = setTimeout(() => controller.abort(), 15000)
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@src/components/home/NewCaseButton.tsx` at line 34, The setTimeout timeout of
5000ms is too short for the two sequential API calls to room creation and
dispute creation. The 5-second timeout can cause premature request cancellation
on slower networks or during server load. Increase the timeout value from 5000
to at least 15000 milliseconds to provide sufficient time for both the room
creation and dispute creation API calls to complete, or alternatively implement
separate timeout mechanisms for each individual API call to better handle their
individual response times.

Comment on lines +30 to +36
// TODO: 진행중인 사건 API 연동 시 활성화
// async function fetchActiveCases(): Promise<ActiveCase[]> {
// const res = await fetch('/api/disputes?active=true')
// if (!res.ok) throw new Error('진행중인 사건을 불러오지 못했습니다.')
// const json = await res.json()
// return json.data.disputes
// }

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🔴 Critical

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
# Participant 타입과 DisputeParticipantDto 간의 nickname 사용 현황 확인

echo "=== DisputeParticipantDto 정의 확인 ==="
rg -n "interface DisputeParticipantDto" -A 10 --type=ts

echo ""
echo "=== useActiveCases의 Participant 타입에서 nickname 사용 확인 ==="
rg -n "nickname" src/hooks/useActiveCases.ts

echo ""
echo "=== ActiveCasesSection에서 nickname 사용 확인 ==="
rg -n "nickname" src/components/home/ActiveCasesSection.tsx

Repository: I5-Project/TALKY-OWL

Length of output: 781


🏁 Script executed:

#!/bin/bash
# Get complete context of useActiveCases.ts
echo "=== Complete useActiveCases.ts (lines 1-50) ==="
head -50 src/hooks/useActiveCases.ts | cat -n

echo ""
echo "=== Check if there's a transformation/mapping between types ==="
rg -n "Participant|DisputeParticipantDto" src/hooks/useActiveCases.ts -B 2 -A 2

Repository: I5-Project/TALKY-OWL

Length of output: 1887


🏁 Script executed:

#!/bin/bash
# Check Dispute type definition and its relationship with participants
echo "=== Dispute type definition ==="
rg -n "export interface Dispute" src/types/dispute.ts -A 15

echo ""
echo "=== Check what fields Dispute includes ==="
rg -n "participants" src/types/dispute.ts -B 2 -A 2

Repository: I5-Project/TALKY-OWL

Length of output: 1757


🏁 Script executed:

#!/bin/bash
# Check for User type and any existing mapping utilities
echo "=== Check User type definition ==="
rg -n "export interface User" src/types -A 10

echo ""
echo "=== Check for any mapper functions ==="
fd . src -name "*map*" -o -name "*transform*" -o -name "*convert*"

echo ""
echo "=== Check how userId relates to User/nickname ==="
rg -n "User.*nickname|nickname.*User" src/types --type ts

Repository: I5-Project/TALKY-OWL

Length of output: 868


TODO 구현 시 타입 구조와 데이터 변환 불일치 해결 필요

주석 처리된 fetchActiveCases를 구현할 때 주의가 필요합니다. API는 DisputeParticipantDto[] 형태로 participants를 반환하지만, 현재 Participant 타입과 구조가 맞지 않습니다:

  • DisputeParticipantDto: 평탄한 구조 (userId, profileImageUrl, role 등)
  • Participant: 중첩된 구조 (user: { nickname, profileImageUrl }, role)

특히 nickname 필드는 DisputeParticipantDto에 없으며, ActiveCasesSection.tsx(line 63)에서 p.user.nickname을 참조하고 있어 런타임 오류가 발생합니다. API 응답을 Participant 타입으로 변환하는 매핑 로직이 필요하며, nickname 데이터를 어디서 가져올지 결정해야 합니다 (User API 별도 조회 또는 API 응답 구조 변경).

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@src/hooks/useActiveCases.ts` around lines 30 - 36, When implementing the
commented-out `fetchActiveCases` function, add a data transformation layer to
map the flat `DisputeParticipantDto[]` structure returned from the API into the
nested `Participant[]` structure expected by the component. The mapping must
handle converting the flat participants data (with userId, profileImageUrl, role
at root level) into the nested structure required by `Participant` (with user
object containing nickname and profileImageUrl). Since the `nickname` field is
not provided by the API response but is referenced in `ActiveCasesSection.tsx`
at line 63 via `p.user.nickname`, you need to either fetch user details
separately from a User API endpoint or adjust the API contract to include
nickname in the participant data. Create a mapping function that transforms each
`DisputeParticipantDto` into a `Participant` object with the correct nested
structure and resolved nickname data.

@evenif99
evenif99 merged commit 84bd0d0 into dev Jun 20, 2026
3 checks passed
@evenif99
evenif99 deleted the revert-83-fix/active-cases-home branch June 20, 2026 02:40

This branch was successfully deployed

1 active deployment
Preview – talky-owl — 1e2d529d Deployed Jun 20, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants