feat: 링크 공유 시 참여자 이름 넣기 (#996)

* feat: 공유 링크에 참여자 이름을 추가하는 기능 추가

* refactor: 카카오톡 image url getImageUrl을 사용하여 가져오도록 설정

* feat: 참여자 명단 앞에 참여자 키워드 붙이고, 참여자 뒤 개행 추가

client/src/hooks/useEventPageLayout.ts

@@ -35,6 +35,7 @@ const useEventPageLayout = () => {
     isAdmin,
     event,
     eventSummary,
+    allMembers: members,
   };
 };
 

client/src/hooks/useShareEvent.ts

@@ -1,16 +1,18 @@
 import getEventIdByUrl from '@utils/getEventIdByUrl';
 import getEventPageUrlByEnvironment from '@utils/getEventPageUrlByEnvironment';
+import getImageUrl from '@utils/getImageUrl';
 
 type UserShareEventProps = {
   eventName: string;
+  allMembers: string[];
 };
 
-const useShareEvent = ({eventName}: UserShareEventProps) => {
+const useShareEvent = ({eventName, allMembers}: UserShareEventProps) => {
   const eventId = getEventIdByUrl();
   const url = getEventPageUrlByEnvironment(eventId, 'home');
 
   const shareInfo = {
-    title: `행동대장이 ${eventName}에\n대한 정산을 요청했어요 :)`,
+    title: `참여자: ${allMembers.join(', ')}\n\n행동대장이 ${eventName}에 대한 정산을 요청했어요 :)`,
     text: '아래 링크에 접속해서 정산 내역을 확인해 주세요!',
     url,
   };
@@ -27,8 +29,7 @@ const useShareEvent = ({eventName}: UserShareEventProps) => {
       content: {
         title: shareInfo.title,
         description: shareInfo.text,
-        imageUrl:
-          'https://wooteco-crew-wiki.s3.ap-northeast-2.amazonaws.com/%EC%9B%A8%EB%94%94%286%EA%B8%B0%29/g583lirp8yg.jpg',
+        imageUrl: getImageUrl('share-image', 'png'),
         link: {
           mobileWebUrl: url,
           webUrl: url,

client/src/pages/event/[eventId]/EventPageLayout.tsx

@@ -25,7 +25,7 @@ export type EventPageContextProps = Event & {
 };
 
 const EventPageLayout = () => {
-  const {event, eventId, eventSummary} = useEventPageLayout();
+  const {event, eventId, eventSummary, allMembers} = useEventPageLayout();
   const {isGuest} = event.userInfo;
 
   const navigate = useNavigate();
@@ -36,7 +36,10 @@ const EventPageLayout = () => {
   };
 
   const isMobile = isMobileDevice();
-  const {kakaoShare, copyShare} = useShareEvent({eventName: event.eventName});
+  const {kakaoShare, copyShare} = useShareEvent({
+    eventName: event.eventName,
+    allMembers: allMembers.map(member => member.name),
+  });
 
   const trackLinkShare = async () => {
     trackShareEvent({...eventSummary, shareMethod: 'link'});