Skip to content

Fix: data-fetch 데이터 리패치 - #146

Merged
skyblue1232 merged 1 commit into
developfrom
refactor/#135/web-app-accessibility
Nov 15, 2025
Merged

skyblue1232 merged 1 commit into
developfrom
refactor/#135/web-app-accessibility

Conversation

@skyblue1232

@skyblue1232 skyblue1232 commented Nov 15, 2025

Copy link
Copy Markdown
Contributor

🔥 작업 내용

  • API 응답 구조(result → data) 불일치 수정
    • 서버 응답: data.places
    • 프론트 코드: result.places
    • 구조 mismatch로 인해 스탬프(hasStamp)가 표시되지 않는 문제 발생
    • const places = data?.data?.places ?? []; 로 수정하여 정상 동작 확인

🤔 추후 작업 사항

  • 스탬프 UI 애니메이션 적용 검토
  • 보드게임 전체 레이아웃 리팩토링 예정

🔗 이슈

  • close #이슈번호

PR Point (To Reviewer)

  • 응답 필드 수정 이후 보드게임 스탬프 표시가 정상적으로 되는지 확인 부탁드립니다.
  • placeId 매칭 시 유효하지 않은 데이터가 없는지 검토 요청드립니다.

📸 피그마 스크린샷 or 기능 GIF

(작업 내역 스크린샷 첨부)

Summary by CodeRabbit

릴리스 노트

  • 버그 수정

    • 장소 ID 타입 호환성을 개선하여 데이터 매칭 안정성 강화
  • 리팩토링

    • API 요청 처리 및 데이터 구조 최적화

@skyblue1232 skyblue1232 self-assigned this Nov 15, 2025
@skyblue1232 skyblue1232 added the fix 버그 및 자잘한 오류 수정 label Nov 15, 2025
@vercel

vercel Bot commented Nov 15, 2025

Copy link
Copy Markdown

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

Project Deployment Preview Comments Updated (UTC)
af-fe Ready Ready Preview Comment Nov 15, 2025 8:13pm

@coderabbitai

coderabbitai Bot commented Nov 15, 2025

Copy link
Copy Markdown
Contributor

개요

API 클라이언트를 apiAuth에서 apiWithToken으로 변경하고, 응답 래퍼 속성을 result에서 data로 수정하며, 장소 데이터 접근 경로를 업데이트하고 placeId 비교 시 숫자형 캐스팅을 추가했습니다.

변경 사항

경로 / 파일 요약
API 클라이언트 업데이트
src/shared/main/api/getHasBoardStamp.ts, src/shared/main/api/getPlaceDetail.ts
apiAuth에서 apiWithToken으로 API 클라이언트 변경
응답 구조 변경
src/shared/main/api/getHasBoardStamp.ts
StampStatusResponse 래퍼 속성 이름을 result에서 data로 수정
데이터 접근 및 비교 로직 업데이트
src/shared/components/main/components/board/Boardgame.tsx
데이터 경로를 data.result.places에서 data.data.places로 변경, 장소 비교 시 Number(p.placeId) === Number(cell.placeId)로 숫자형 캐스팅 추가

예상 코드 리뷰 소요 시간

🎯 2 (단순) | ⏱️ ~10분

  • API 클라이언트 변경의 일관성 확인 필요
  • 응답 데이터 구조 변경에 따른 모든 접근 지점 검증
  • Number() 캐스팅이 문자열/숫자 타입 혼합 상황을 올바르게 처리하는지 확인

관련 PR

제안 라벨

api

제안 리뷰어

  • KongMezu
  • jjangminii

🐰 숨겨진 장소를 찾아다니며,
API 경로를 다시 그으니,
숫자와 문자도 이제 친구,
토큰으로 안전하게 접근하고,
보드 게임의 스탬프는 반짝반짝 ✨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)
Check name Status Explanation
Description check ✅ Passed PR 설명이 요구되는 템플릿의 모든 필수 섹션을 포함하고 있으며, 변경사항, 이슈 참조, 리뷰어를 위한 포인트가 상세히 기술되어 있습니다.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Title check ✅ Passed 제목이 PR의 주요 변경사항을 명확하게 요약하고 있습니다. API 응답 구조 불일치를 수정하는 것이 주요 목적이며, 제목 '데이터 리패치'는 이를 직접적으로 반영합니다.
✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch refactor/#135/web-app-accessibility

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

@skyblue1232 skyblue1232 changed the title Fix: data-fetch Fix: data-fetch 데이터 리패치 Nov 15, 2025
@github-actions

Copy link
Copy Markdown

🏷️ Labeler has automatically applied labels based on your PR title, branch name, or commit message.
Please verify that they are correct before merging.

@github-actions github-actions Bot added the comment 필요한 주석 추가 및 변경 label Nov 15, 2025
@skyblue1232
skyblue1232 merged commit ec07a19 into develop Nov 15, 2025
6 of 8 checks passed

@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: 1

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 04a4be1 and 9594987.

📒 Files selected for processing (3)
  • src/shared/components/main/components/board/Boardgame.tsx (2 hunks)
  • src/shared/main/api/getHasBoardStamp.ts (2 hunks)
  • src/shared/main/api/getPlaceDetail.ts (2 hunks)
🧰 Additional context used
🧬 Code graph analysis (3)
src/shared/main/api/getPlaceDetail.ts (4)
src/shared/api/instance.ts (1)
  • apiWithToken (14-17)
src/shared/types/authtypes.ts (1)
  • ApiResponse (1-6)
src/shared/main/queries/useGetPlaceDetail.ts (2)
  • getPlaceDetail (7-7)
  • placeId (4-10)
src/shared/api/main/node/api/stampAcquire.ts (1)
  • placeId (4-13)
src/shared/main/api/getHasBoardStamp.ts (5)
src/shared/api/instance.ts (1)
  • apiWithToken (14-17)
src/shared/main/api/getStampStatus.ts (2)
  • Promise (10-15)
  • StampStatus (4-8)
src/shared/api/main/node/api/stampAcquire.ts (1)
  • placeId (4-13)
src/shared/api/main/node/types/stampAcquireTypes.ts (2)
  • StampAcquireResponse (14-26)
  • PostcardData (6-12)
src/pages/main/node/[placeId].tsx (1)
  • pos (79-107)
src/shared/components/main/components/board/Boardgame.tsx (2)
src/pages/main/node/[placeId].tsx (2)
  • res (92-100)
  • router (20-191)
src/shared/components/map/result/components/ResultList.tsx (3)
  • place (36-52)
  • place (14-24)
  • ResultListProps (7-9)
🔇 Additional comments (4)
src/shared/components/main/components/board/Boardgame.tsx (2)

13-13: 데이터 경로 수정이 올바르게 적용되었습니다.

data?.result?.places에서 data?.data?.places로의 변경이 API 응답 구조와 일치합니다. 이 변경으로 스탬프 표시 문제가 해결됩니다.


42-42: 리뷰 코멘트 무효 - 양쪽 모두 이미 number 타입입니다.

검증 결과, Place 인터페이스(src/shared/main/api/getHasBoardStamp.ts)에서 placeIdnumber 타입이고, boardDatacell.placeId도 모두 숫자로 정의되어 있습니다. 따라서 Number() 변환이 불필요하며, 타입 불일치는 발생하지 않습니다. 현재 코드는 올바른 상태입니다.

src/shared/main/api/getHasBoardStamp.ts (2)

1-1: API 클라이언트 마이그레이션이 올바르게 적용되었습니다.

apiAuth에서 apiWithToken으로의 전환이 다른 API 파일들과 일관되게 적용되었습니다.

Also applies to: 19-20


9-16: API 응답 구조 변경이 올바르게 적용되었습니다.

검증 결과:

  • StampStatusResponse 인터페이스의 data 필드 구조 확인됨 (data: { places: Place[] })
  • ✓ 함수 반환값과 사용처(Boardgame.tsx)의 접근 방식이 일치 (data?.data?.places)
  • ✓ 이전 result.places 패턴 완전히 제거됨

모든 변경사항이 일관성 있게 적용되었으므로 추가 수정이 필요하지 않습니다.

@@ -1,4 +1,4 @@
import { apiAuth } from '@/shared/api/instance';
import { apiWithToken } from '@/shared/api/instance';

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

🧩 Analysis chain

API 클라이언트 마이그레이션 확인이 필요합니다.

apiAuth에서 apiWithToken으로의 전환은 올바르게 구현되었습니다. 하지만 코드베이스 전체에서 apiAuth의 다른 사용처가 모두 마이그레이션되었는지 확인이 필요합니다.

다음 스크립트를 실행하여 apiAuth의 남은 사용처를 확인하세요:

Also applies to: 14-17


🏁 Script executed:

#!/bin/bash
# Description: apiAuth의 남은 사용처를 찾아 마이그레이션이 완료되었는지 확인

# apiAuth import 및 사용 검색
echo "=== apiAuth import 검색 ==="
rg -n "from.*apiAuth|import.*apiAuth" --type=ts --type=tsx

echo -e "\n=== apiAuth 직접 사용 검색 ==="
rg -n "apiAuth\." --type=ts --type=tsx -A 2

Length of output: 107


파일 타입 감지 오류로 인해 재검증이 필요합니다. 수정된 스크립트로 다시 확인하겠습니다.


---

🏁 Script executed:

```shell
#!/bin/bash
# Description: apiAuth의 남은 사용처를 찾아 마이그레이션 완료 여부 확인 (수정된 버전)

# apiAuth import 검색 (파일 타입 제한 없음)
echo "=== apiAuth import 검색 ==="
rg "from.*apiAuth|import.*apiAuth" -n

echo -e "\n=== apiAuth 직접 사용 검색 ==="
rg "apiAuth\." -n -A 2

echo -e "\n=== apiAuth 정의/내보내기 검색 ==="
rg "export.*apiAuth|const apiAuth|apiAuth\s*=" -n -A 2

echo -e "\n=== 전체 코드베이스에서 'apiAuth' 검색 ==="
rg "apiAuth" -n --no-heading | head -20

Length of output: 1341


API 클라이언트 마이그레이션이 완료되지 않았습니다.

검증 결과, 다음 파일들에서 apiAuth가 여전히 사용 중입니다:

  • src/shared/api/auth.ts:6 - apiAuth.post() 사용
  • src/shared/api/course/api/getCourseSession.ts:5 - apiAuth.get() 사용

apiWithToken으로의 마이그레이션을 완료하려면 이 파일들도 함께 업데이트해야 합니다. 또는 이 파일들이 의도적으로 apiAuth를 사용해야 한다면 명확히 해 주세요.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

comment 필요한 주석 추가 및 변경 fix 버그 및 자잘한 오류 수정

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant