[feature] ClubDetailPage에서 공유 버튼 표시 활성화

.gitignore

@@ -4,3 +4,6 @@
 .DS_Store
 
 .env
+
+CLAUDE.md
+.claude

frontend/src/pages/ClubDetailPage/ClubDetailPage.tsx

@@ -1,19 +1,19 @@
 import { useCallback, useRef } from 'react';
 import { useParams, useSearchParams } from 'react-router-dom';
-import ClubDetailTopBar from './components/ClubDetailTopBar/ClubDetailTopBar';
 import Footer from '@/components/common/Footer/Footer';
 import Header from '@/components/common/Header/Header';
 import { PAGE_VIEW, USER_EVENT } from '@/constants/eventName';
 import useMixpanelTrack from '@/hooks/Mixpanel/useMixpanelTrack';
 import useTrackPageView from '@/hooks/Mixpanel/useTrackPageView';
 import { useGetClubDetail } from '@/hooks/Queries/useClub';
-import useDevice from '@/hooks/useDevice';
 import { useScrollTo } from '@/hooks/Scroll/useScrollTo';
+import useDevice from '@/hooks/useDevice';
 import ClubFeed from '@/pages/ClubDetailPage/components/ClubFeed/ClubFeed';
 import ClubIntroContent from '@/pages/ClubDetailPage/components/ClubIntroContent/ClubIntroContent';
 import ClubProfileCard from '@/pages/ClubDetailPage/components/ClubProfileCard/ClubProfileCard';
 import * as Styled from './ClubDetailPage.styles';
 import ClubDetailFooter from './components/ClubDetailFooter/ClubDetailFooter';
+import ClubDetailTopBar from './components/ClubDetailTopBar/ClubDetailTopBar';
 
 export const TAB_TYPE = {
   INTRO: 'intro',
@@ -47,7 +47,6 @@ const ClubDetailPage = () => {
   const contentRef = useRef<HTMLDivElement>(null);
   const { scrollToElement } = useScrollTo();
 
-
   const scrollToContent = useCallback(() => {
     scrollToElement(contentRef.current, TOP_BAR_HEIGHT);
   }, [scrollToElement]);
@@ -58,10 +57,10 @@ const ClubDetailPage = () => {
       trackEvent(
         tabKey === TAB_TYPE.INTRO
           ? USER_EVENT.CLUB_INTRO_TAB_CLICKED
-          : USER_EVENT.CLUB_FEED_TAB_CLICKED
+          : USER_EVENT.CLUB_FEED_TAB_CLICKED,
       );
     },
-    [setSearchParams, trackEvent]
+    [setSearchParams, trackEvent],
   );
 
   if (error) {
@@ -119,10 +118,18 @@ const ClubDetailPage = () => {
             </Styled.TabList>
 
             <Styled.TabContent>
-              <div style={{ display: activeTab === TAB_TYPE.INTRO ? 'block' : 'none' }}>
+              <div
+                style={{
+                  display: activeTab === TAB_TYPE.INTRO ? 'block' : 'none',
+                }}
+              >
                 <ClubIntroContent {...clubDetail.description} />
               </div>
-              <div style={{ display: activeTab === TAB_TYPE.PHOTOS ? 'block' : 'none' }}>
+              <div
+                style={{
+                  display: activeTab === TAB_TYPE.PHOTOS ? 'block' : 'none',
+                }}
+              >
                 <ClubFeed feed={clubDetail.feeds} clubName={clubDetail.name} />
               </div>
             </Styled.TabContent>

frontend/src/pages/ClubDetailPage/LegacyClubDetailPage.tsx

@@ -104,6 +104,7 @@ const LegacyClubDetailPage = () => {
         recruitmentStart={clubDetail.recruitmentStart}
         recruitmentEnd={clubDetail.recruitmentEnd}
         recruitmentStatus={clubDetail.recruitmentStatus}
+        hideShareButtonOnMobile
       />
     </>
   );

frontend/src/pages/ClubDetailPage/components/ClubApplyButton/ClubApplyButton.tsx

@@ -5,22 +5,28 @@ import ApplicationSelectModal from '@/components/application/modals/ApplicationS
 import { USER_EVENT } from '@/constants/eventName';
 import useMixpanelTrack from '@/hooks/Mixpanel/useMixpanelTrack';
 import { useGetClubDetail } from '@/hooks/Queries/useClub';
+import useDevice from '@/hooks/useDevice';
 import { ApplicationForm, ApplicationFormMode } from '@/types/application';
 import ShareButton from '../ShareButton/ShareButton';
-import useDevice from '@/hooks/useDevice';
 import * as Styled from './ClubApplyButton.styles';
 
 interface ClubApplyButtonProps {
   deadlineText?: string;
+  hideShareButtonOnMobile?: boolean;
 }
 
-const ClubApplyButton = ({ deadlineText }: ClubApplyButtonProps) => {
+const ClubApplyButton = ({
+  deadlineText,
+  hideShareButtonOnMobile = false,
+}: ClubApplyButtonProps) => {
   const { clubId } = useParams<{ clubId: string }>();
   const navigate = useNavigate();
   const trackEvent = useMixpanelTrack();
   const { data: clubDetail } = useGetClubDetail(clubId!);
   const { isMobile, isTablet } = useDevice();
-  const shouldShowShareButton = !isMobile && !isTablet;
+  const shouldShowShareButton = hideShareButtonOnMobile
+    ? !isMobile && !isTablet
+    : true;
 
   const [isApplicationModalOpen, setIsApplicationModalOpen] = useState(false);
   const [applicationOptions, setApplicationOptions] = useState<

frontend/src/pages/ClubDetailPage/components/ClubDetailFooter/ClubDetailFooter.tsx

@@ -8,12 +8,14 @@ interface ClubDetailFooterProps {
   recruitmentStart: string;
   recruitmentEnd: string;
   recruitmentStatus: RecruitmentStatus;
+  hideShareButtonOnMobile?: boolean;
 }
 
 const ClubDetailFooter = ({
   recruitmentStart,
   recruitmentEnd,
   recruitmentStatus,
+  hideShareButtonOnMobile = false,
 }: ClubDetailFooterProps) => {
   const deadlineText = getDeadlineText(
     recruitmentDateParser(recruitmentStart),
@@ -23,7 +25,10 @@ const ClubDetailFooter = ({
 
   return (
     <Styled.ClubDetailFooterContainer>
-      <ClubApplyButton deadlineText={deadlineText} />
+      <ClubApplyButton
+        deadlineText={deadlineText}
+        hideShareButtonOnMobile={hideShareButtonOnMobile}
+      />
     </Styled.ClubDetailFooterContainer>
   );
 };

frontend/src/pages/ClubDetailPage/components/ShareButton/ShareButton.tsx

@@ -14,7 +14,7 @@ interface ShareButtonProps {
 
 const isRNWebView = isInAppWebView();
 
-const MOADONG_BASE_URL = 'https://www.moadong.com/club/';
+const MOADONG_BASE_URL = 'https://www.moadong.com/clubDetail/';
 
 const ShareButton = ({ clubId }: ShareButtonProps) => {
   const { isMobile } = useDevice();