[release] FE v1.1.21

[seongwon030]

#️⃣연관된 이슈

ex) #이슈번호, #이슈번호

📝작업 내용

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

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

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

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

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

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

🫡 참고사항

Summary by CodeRabbit

릴리스 노트

• 새로운 기능

  • 동아리 설명의 URL이 자동으로 클릭 가능한 링크로 변환되고 줄바꿈이 보존됩니다.
  • 모바일에서 공유 버튼을 숨길 수 있는 옵션이 추가되었습니다.

• 개선사항

  • 동아리 상세 페이지 상단 바가 복원되어 탭 전환이 정상 동작합니다.
  • 공유 URL 경로가 업데이트되었습니다.

• 테스트

  • 링크 변환 동작을 검증하는 단위 테스트가 추가되었습니다.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
moadong	Ready	Preview, Comment	Jan 31, 2026 8:46am

[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

Walkthrough

React Query 캐시 키를 중앙화하고 ClubDetailTopBar를 재도입했습니다. 푸터·신청 버튼에 모바일에서 공유 버튼을 숨기는 옵션을 추가했고, 텍스트의 URL을 줄바꿈 보존과 함께 링크로 변환하는 유틸리티와 관련 테스트를 추가했습니다. 공유 기본 경로도 변경되었습니다.

Changes

Cohort / File(s)	Summary
구성 \.gitignore	CLAUDE.md, .claude 무시 항목 추가
쿼리 캐시 리팩토링 frontend/src/pages/AdminPage/tabs/ApplicationEditTab/ApplicationEditTab.tsx	하드코딩된 React Query invalidate 키를 queryKeys.application 상수로 교체
ClubDetail 페이지 통합 frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx, frontend/src/pages/ClubDetailPage/LegacyClubDetailPage.tsx	ClubDetailTopBar 재도입 및 탭 동작 복원, 레이아웃 스타일 소폭 조정
공유 버튼 모바일 제어 frontend/src/pages/ClubDetailPage/components/ClubApplyButton/ClubApplyButton.tsx, frontend/src/pages/ClubDetailPage/components/ClubDetailFooter/ClubDetailFooter.tsx	hideShareButtonOnMobile?: boolean prop 추가, useDevice 기반으로 모바일/태블릿에서 ShareButton 조건부 렌더링 구현 및 prop 전달
링크화 유틸리티 및 컴포넌트 frontend/src/utils/linkifyText.tsx, frontend/src/utils/linkifyText.test.tsx, frontend/src/pages/ClubDetailPage/components/ClubIntroContent/LinkifiedText.tsx, frontend/src/pages/ClubDetailPage/components/ClubIntroContent/ClubIntroContent.tsx	텍스트 내 URL을 로 변환하고 줄바꿈을 보존하는 linkifyText 유틸 및 테스트 추가; LinkifiedText 컴포넌트 추가 및 ClubIntroContent의 여러 텍스트 필드를 해당 컴포넌트로 렌더링 변경
공유 URL 기본 경로 변경 frontend/src/pages/ClubDetailPage/components/ShareButton/ShareButton.tsx	MOADONG_BASE_URL을 /club/에서 /clubDetail/로 업데이트

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

• [feature] FAQ 답변 텍스트 내 URL을 자동으로 링크 처리한다 #1117: 동일한 linkifyText 유틸 및 LinkifiedText 컴포넌트 도입과 ClubIntroContent 변경과 직접 중복됨
• [feature] 상세 페이지 모바일 탑바 웹뷰로 이관 및 리액트 네이티브 API 연동 구조 도입 #1090: ClubDetailTopBar 관련 변경으로, 이 PR에서 해당 컴포넌트를 재도입·통합하는 작업과 관련됨
• [release] FE v1.1.20 #1116: ClubApplyButton/공유 버튼 관련 변경과 겹치는 코드 수정(공유 버튼 가시성·props 변경) 관련

Suggested reviewers

• seongwon030
• oesnuj
• lepitaaar

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Title check	⚠️ Warning	PR 제목은 변경사항의 주요 내용을 반영하지 못하고 있습니다. '[release] FE v1.1.21'은 버전 릴리스를 나타낼 뿐, 실제 구현된 기능(QueryKeys 일관성 개선, ClubDetailTopBar 재도입, 링크 자동변환, 모바일 공유버튼 숨김 등)을 구체적으로 설명하지 않습니다.	PR 제목을 구체적인 변경사항을 반영하도록 수정하세요. 예: '[release] FE v1.1.21: QueryKeys 통합, ClubDetailTopBar 복원, 텍스트 링크화 기능 추가'

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

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

✨ 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 develop-fe

---

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

🤖 Fix all issues with AI agents

In `@frontend/src/utils/linkifyText.tsx`:
- Line 4: The URL_REGEX constant in linkifyText.tsx currently matches trailing
punctuation; update the regex referenced by URL_REGEX so it does not include
common trailing punctuation characters (e.g. . , ? ! : ; ) ] } ' " ) ) — for
example use a character class or negative lookahead to stop the match before
those punctuation chars (keep the scheme match https?:// and the global flag),
or replace matched URLs with a post-processing trim that strips trailing
punctuation; locate URL_REGEX in linkifyText.tsx and change the pattern or add
trimming logic to ensure URLs like "https://example.com." are matched as
"https://example.com".

🧹 Nitpick comments (3)

frontend/src/utils/linkifyText.tsx (1)

38-47: 인라인 스타일 대신 styled-components 사용 고려.

프로젝트가 styled-components를 사용하고 있으므로, 일관성을 위해 앵커 스타일도 styled-components로 정의하는 것이 좋습니다.

♻️ styled-components 사용 예시

// linkifyText.styles.ts
import styled from 'styled-components';
import { colors } from '@/styles/theme/colors';

export const LinkAnchor = styled.a`
  color: ${colors.accent[1][900]};
  text-decoration: underline;
`;

// linkifyText.tsx
+import * as Styled from './linkifyText.styles';

    nodes.push(
-      <a 
-        key={urlStartIndex} 
-        href={urlText} 
-        style={{ 
-          color: colors.accent[1][900], 
-          textDecoration: 'underline' 
-          }}
-        >
-        {urlText}
-      </a>
+      <Styled.LinkAnchor key={urlStartIndex} href={urlText}>
+        {urlText}
+      </Styled.LinkAnchor>
    );

frontend/src/utils/linkifyText.test.tsx (1)

4-88: 줄바꿈 보존에 대한 테스트 케이스 추가를 권장합니다.

linkifyText는 renderTextWithLineBreaks 헬퍼를 통해 줄바꿈(\n)을 <br> 요소로 변환하는 기능이 있지만, 이에 대한 테스트가 없습니다.

💚 줄바꿈 테스트 케이스 제안

it('줄바꿈이 있는 텍스트는 br 요소로 변환된다', () => {
  const { container } = render(
    <>{linkifyText('첫 번째 줄\n두 번째 줄')}</>
  );

  const brElements = container.querySelectorAll('br');
  expect(brElements.length).toBe(1);
  expect(container.textContent).toBe('첫 번째 줄두 번째 줄');
});

it('URL과 줄바꿈이 함께 있는 텍스트를 올바르게 처리한다', () => {
  render(
    <>{linkifyText('참고:\nhttps://example.com\n감사합니다')}</>
  );

  const link = screen.getByRole('link', { name: 'https://example.com' });
  expect(link).not.toBeNull();
});

frontend/src/pages/ClubDetailPage/components/ClubIntroContent/LinkifiedText.tsx (1)

7-7: text가 빈 값일 때의 처리를 고려하세요.

text prop이 빈 문자열이거나 undefined/null로 전달될 경우에 대한 방어 로직이 없습니다. 타입상으로는 string이지만, 런타임에서 잘못된 값이 전달될 수 있습니다.

🛡️ 방어 코드 제안

-const LinkifiedText = ({ text }: LinkifiedTextProps) => linkifyText(text);
+const LinkifiedText = ({ text }: LinkifiedTextProps) => {
+  if (!text) return null;
+  return linkifyText(text);
+};

[suhyun113]

릴리즈 갑시다!!