[fix] 추천동아리 목록을 제거한다

[seongwon030]

#️⃣연관된 이슈

ex) #811

📝작업 내용

이번 PR에서 작업한 내용을 간략히 설명해주세요(이미지/동영상 첨부 가능)

#773 메인페이지 카드 디자인 수정으로 추천동아리 목록 UI가 깨지는 문제가 있었습니다.

또한 기존에 추천동아리를 추가한 이유가 명확하지 않았어서 겸사겸사 지우기로 했습니다.

중점적으로 리뷰받고 싶은 부분(선택)

리뷰어가 특별히 봐주었으면 하는 부분이 있다면 작성해주세요

ex) 메서드 XXX의 이름을 더 잘 짓고 싶은데 혹시 좋은 명칭이 있을까요?

논의하고 싶은 부분(선택)

논의하고 싶은 부분이 있다면 작성해주세요.

🫡 참고사항

Summary by CodeRabbit

릴리스 노트

• UI 개선
  • 클럽 상세 페이지의 권장 클럽 섹션이 비활성화되었습니다.
  • 사진 목록 아래의 공백이 증가하여 레이아웃의 시각적 여백이 개선되었습니다.

[vercel]

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

Project	Deployment	Preview	Comments	Updated (UTC)
moadong	Ready	Preview	Comment	Nov 9, 2025 5:25am

[coderabbitai]

Warning

.coderabbit.yaml has a parsing error

The CodeRabbit configuration file in this repository has a parsing error and default settings were used instead. Please fix the error(s) in the configuration file. You can initialize chat with CodeRabbit to get help with the configuration file.

💥 Parsing errors (1)

Validation error: Invalid regex pattern for base branch. Received: "**" at "reviews.auto_review.base_branches[0]"

⚙️ Configuration instructions

• Please see the configuration documentation for more information.
• You can also validate your configuration using the online YAML validator.
• If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

주요 변경 사항

RecommendedClubs 컴포넌트가 ClubDetailPage에서 제거되고 PhotoList 컨테이너에 하단 여백이 추가됩니다. 렌더링 로직과 스타일 간격 조정의 두 가지 UI 개선이 포함됩니다.

변경 파일 및 요약

내용	파일(들)
ClubDetailPage 추천동아리 제거 RecommendedClubs 컴포넌트 사용 코드 주석 처리로 해당 섹션 비활성화	frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx
PhotoList 스타일 간격 조정 PhotoListContainer에 margin-bottom: 60px 추가하여 하단 여백 증가	frontend/src/pages/ClubDetailPage/components/PhotoList/PhotoList.styles.ts

예상 코드 리뷰 난이도

🎯 2 (Simple) | ⏱️ ~8분

• 주의 사항:
  • RecommendedClubs 컴포넌트가 완전히 제거되는지 아니면 임시로 주석 처리되는지 확인
  • 추가된 margin-bottom: 60px이 다양한 화면 크기에서 시각적으로 적절한지 검증
  • 관련된 테스트 케이스 업데이트 여부 확인

연관 이슈

• MOA-307: 추천동아리 목록 제거 - ClubDetailPage에서 RecommendedClubs 컴포넌트 비활성화로 추천동아리 기능 제거 목표 달성

관련 PR

• [refactor] tanstackQuery 최적화 및 활동사진 컴포넌트 리팩토링 #237: ClubDetailPage 및 사진 관련 UI(PhotoList 스타일) 수정 포함
• [refactor] 모바일 활동사진 UI 그리드 형태로 수정 및 반응형 개선 작업 #554: PhotoList.styles.ts 파일의 간격 및 레이아웃 변경
• [fix] 비참여동아리 alert 및 리다이렉션 기능 제거 #559: ClubDetailPage.tsx의 렌더링 로직 수정

제안 레이블

💻 FE, 🛠Fix

제안 리뷰어

• oesnuj
• lepitaaar
• Zepelown

Pre-merge checks and finishing touches

✅ Passed checks (5 passed)

Check name	Status	Explanation
Title check	✅ Passed	PR 제목이 주요 변경 사항을 명확하게 반영합니다. ClubDetailPage에서 RecommendedClubs 컴포넌트를 제거하고 PhotoList에 여백을 추가하는 변경 사항과 일치합니다.
Linked Issues check	✅ Passed	연결된 이슈 MOA-307의 요구사항인 '추천동아리 기능을 제거한다'가 PR의 코드 변경 사항과 일치합니다.
Out of Scope Changes check	✅ Passed	PhotoList.styles.ts의 margin-bottom 추가는 제거된 RecommendedClubs 섹션 후 레이아웃을 조정하는 관련 변경으로 보이며, 연결된 이슈의 범위 내에 있습니다.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.

✨ 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 fix/#811-remove-recommend-club-MOA-307

---

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

• X
• Mastodon
• Reddit
• LinkedIn

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

[coderabbitai]

Actionable comments posted: 0

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx (1)

16-16: 사용하지 않는 import를 제거하세요.

RecommendedClubs 컴포넌트가 더 이상 사용되지 않으므로 import 문을 제거하여 코드를 정리해야 합니다.

다음 diff를 적용하여 사용하지 않는 import를 제거하세요:

-import RecommendedClubs from '@/pages/ClubDetailPage/components/RecommendedClubs/RecommendedClubs';

🧹 Nitpick comments (1)

frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx (1)

70-70: 주석 처리 대신 완전히 제거하는 것을 고려하세요.

컴포넌트를 주석 처리하는 대신 완전히 제거하는 것이 더 깔끔합니다. 필요시 Git 히스토리를 통해 복원할 수 있습니다.

다음 diff를 적용하여 주석 처리된 라인을 완전히 제거하세요:

-        {/* <RecommendedClubs clubs={clubDetail.recommendClubs ?? []} /> */}

📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

Disabled knowledge base sources:

• Jira integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

📥 Commits

Reviewing files that changed from the base of the PR and between 716abb2 and 849b7ba.

📒 Files selected for processing (2)

• frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx (1 hunks)
• frontend/src/pages/ClubDetailPage/components/PhotoList/PhotoList.styles.ts (1 hunks)

🧰 Additional context used

📓 Path-based instructions (2)

frontend/**/*.{ts,tsx}

📄 CodeRabbit inference engine (frontend/.cursorrules)

frontend/**/*.{ts,tsx}: Replace magic numbers with named constants for clarity.
Replace complex or nested ternary operators with if/else statements or IIFEs for readability.
Assign complex boolean conditions to named variables.
Use consistent return types for similar functions and hooks.
Avoid hidden side effects; functions should only perform actions implied by their signature (Single Responsibility Principle).
Use unique, descriptive names for custom wrappers and functions to avoid ambiguity.
Define constants near related logic or ensure names link them clearly.

Files:

• frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx
• frontend/src/pages/ClubDetailPage/components/PhotoList/PhotoList.styles.ts

frontend/**/*.tsx

📄 CodeRabbit inference engine (frontend/.cursorrules)

frontend/**/*.tsx: Abstract complex logic/interactions into dedicated components or higher-order components (HOCs).
Separate significantly different conditional UI/logic into distinct components.
Colocate simple, localized logic or use inline definitions to reduce context switching.
Choose field-level or form-level cohesion based on form requirements.
Break down broad state management into smaller, focused hooks or contexts.
Use component composition instead of props drilling.

Files:

• frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx

🧠 Learnings (2)

📚 Learning: 2025-07-19T05:05:10.196Z

Learnt from: seongwon030
Repo: Moadong/moadong PR: 548
File: frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx:17-57
Timestamp: 2025-07-19T05:05:10.196Z
Learning: ClubDetailPage.tsx에서 notJoinedClubNames 배열의 하드코딩은 의도적인 설계 결정입니다. 개발자가 명시적으로 하드코딩을 선택했으므로 이에 대한 리팩토링 제안을 하지 않아야 합니다.

Applied to files:

• frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx

📚 Learning: 2025-03-19T05:18:07.818Z

Learnt from: seongwon030
Repo: Moadong/moadong PR: 195
File: frontend/src/pages/AdminPage/AdminPage.tsx:7-7
Timestamp: 2025-03-19T05:18:07.818Z
Learning: AdminPage.tsx에서 현재 하드코딩된 클럽 ID('67d2e3b9b15c136c6acbf20b')는 로그인 기능 구현 후 동적으로 가져오는 방식으로 수정될 예정입니다.

Applied to files:

• frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx

🔇 Additional comments (1)

frontend/src/pages/ClubDetailPage/components/PhotoList/PhotoList.styles.ts (1)

18-18: 추천동아리 제거에 따른 하단 여백 추가가 적절합니다.

RecommendedClubs 컴포넌트 제거로 인해 PhotoList가 마지막 콘텐츠 요소가 되므로, 푸터와의 적절한 간격을 위해 하단 마진을 추가한 것은 올바른 UI 조정입니다.

[oesnuj]

LGTM 수고하셨습니다!