From be459fb2e053dddf41d8d5f4d8f72db78fda3bb5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EC=9D=B4=EC=84=B8=EB=AF=BC?= <89172499+semnil5202@users.noreply.github.com> Date: Wed, 28 Aug 2024 00:53:02 +0900 Subject: [PATCH] =?UTF-8?q?refactor(web-domains):=20=EC=B9=B4=EC=B9=B4?= =?UTF-8?q?=EC=98=A4=ED=86=A1=20=EA=B3=B5=EC=9C=A0=ED=95=98=EA=B8=B0=20?= =?UTF-8?q?=EB=AA=A8=EB=8B=AC=20=EC=9D=B4=EB=AF=B8=EC=A7=80=20=EB=B0=8F=20?= =?UTF-8?q?=EB=A9=98=ED=8A=B8=20=EB=93=B1=20=EA=B0=81=EC=A2=85=20=EC=9D=B4?= =?UTF-8?q?=EC=8A=88=20=ED=95=B4=EA=B2=B0=20(#166)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * refactor: 답변 완료 후 모임원에게 답변 재촉 카카오톡 공유 기능에 image, description 추가 * fix: share-group에서 다음 질문인 이름이 현재 질문인 이름으로 나오는 버그 해결 * feat: kakao share button text 문구 기능 추가 * fix: current meeting name을 잘못 읽어오던 오류 수정 * refactor: 모임 초대 카카오 공유시 누락된 설명 및 이미지 추가 * fix: 다음 질문인 null 대응 * fix: questionDetail 질문 미리보기 고정값으로 나오던 이슈 해결 --- .../containers/AnswerClosingContainer.tsx | 6 +++++- .../services/useAnswerClosingService.ts | 4 ++++ .../KakaoShare/generateKakaoShare.utils.ts | 15 +++++++++++++++ .../GatherMemberProfileListContainer.tsx | 3 +++ .../useGatherMemberProfileListService.tsx | 6 ++++++ .../components/Question/Question.tsx | 2 +- .../CurrentRelayQuestionCountContainer.tsx | 4 ++-- 7 files changed, 36 insertions(+), 4 deletions(-) diff --git a/packages/web-domains/src/answer/features/answer-closing/containers/AnswerClosingContainer.tsx b/packages/web-domains/src/answer/features/answer-closing/containers/AnswerClosingContainer.tsx index e730827a..49b9be9b 100644 --- a/packages/web-domains/src/answer/features/answer-closing/containers/AnswerClosingContainer.tsx +++ b/packages/web-domains/src/answer/features/answer-closing/containers/AnswerClosingContainer.tsx @@ -7,8 +7,10 @@ import { ClosingButton } from '../../floating-button/components/ClosingButton'; import { ClosingMessage } from '../components/ClosingMessage'; import { useAnswerClosingService } from '../services/useAnswerClosingService'; +const KAKAO_SHARE_IMAGE_URL = 'https://file.moring.one/defaults/question_narrow.png'; + export const AnswerClosingContainer = () => { - const { meetingId, answerGlobalTime, isOpen, basePath, close } = useAnswerClosingService(); + const { meetingId, meetingName, answerGlobalTime, isOpen, basePath, close } = useAnswerClosingService(); return ( <> @@ -27,6 +29,8 @@ export const AnswerClosingContainer = () => { onClose={close} topTitle="모임원들에게 릴레이 질문을" bottomTitle="공유해보세요!" + shareDescription={`${meetingName} 모임 질문을 잊진 않으셨나요?`} + shareImageUrl={KAKAO_SHARE_IMAGE_URL} shareLink={`${basePath}/${meetingId}/answer/opening`} /> diff --git a/packages/web-domains/src/answer/features/answer-closing/services/useAnswerClosingService.ts b/packages/web-domains/src/answer/features/answer-closing/services/useAnswerClosingService.ts index 85501547..e01e942d 100644 --- a/packages/web-domains/src/answer/features/answer-closing/services/useAnswerClosingService.ts +++ b/packages/web-domains/src/answer/features/answer-closing/services/useAnswerClosingService.ts @@ -6,12 +6,15 @@ import { useGetProgressingQuestion } from '@/answer/common/apis/queries/useGetPr import { answerAtoms } from '@/answer/common/atoms/answer.atom'; import { getWebDomain } from '@/common'; import { useDialogContext } from '@/common/contexts/DialogProvider'; +import { useGetMeetingInfo } from '@/home/common/apis/queries/useGetMeetingName'; export const useAnswerClosingService = () => { const { meetingId } = useParams<{ meetingId: string }>(); const [answerGlobalTime, setAnswerGlobalTime] = useAtom(answerAtoms.answerGlobalTime); + const { data: meetingInfo } = useGetMeetingInfo({}); const { close, isOpen } = useDialogContext(); + const meetingName = meetingInfo?.meetings.find((meeting) => meeting.meetingId === Number(meetingId))?.name; const basePath = getWebDomain(); useGetProgressingQuestion({ @@ -29,6 +32,7 @@ export const useAnswerClosingService = () => { return { meetingId, + meetingName, answerGlobalTime: answerGlobalTime ?? 0, isOpen, close, diff --git a/packages/web-domains/src/common/components/KakaoShare/generateKakaoShare.utils.ts b/packages/web-domains/src/common/components/KakaoShare/generateKakaoShare.utils.ts index ffc5763f..f3fd2469 100644 --- a/packages/web-domains/src/common/components/KakaoShare/generateKakaoShare.utils.ts +++ b/packages/web-domains/src/common/components/KakaoShare/generateKakaoShare.utils.ts @@ -10,6 +10,12 @@ interface ShareToKakaoProps { shareLink: string; } +const buttonTextMap: Record = { + 'https://file.moring.one/defaults/invite_narrow.png': '모임 참여하기', + 'https://file.moring.one/defaults/question_narrow.png': '답변하러 가기', + 'https://file.moring.one/defaults/new_question_narrow.png': '답변하러 가기', +}; + export const generateKakaoShare = ({ shareLink, shareImageUrl, shareDescription }: ShareToKakaoProps) => { const { Kakao } = window; @@ -26,5 +32,14 @@ export const generateKakaoShare = ({ shareLink, shareImageUrl, shareDescription mobileWebUrl: shareLink, }, }, + buttons: [ + { + title: buttonTextMap[shareImageUrl], + link: { + webUrl: shareLink, + mobileWebUrl: shareLink, + }, + }, + ], }); }; diff --git a/packages/web-domains/src/home/features/gather-member/containers/GatherMemberProfileListContainer.tsx b/packages/web-domains/src/home/features/gather-member/containers/GatherMemberProfileListContainer.tsx index 3a283d32..e372a91c 100644 --- a/packages/web-domains/src/home/features/gather-member/containers/GatherMemberProfileListContainer.tsx +++ b/packages/web-domains/src/home/features/gather-member/containers/GatherMemberProfileListContainer.tsx @@ -11,6 +11,7 @@ import { useGatherMemberProfileListService } from '../services/useGatherMemberPr export const GatherMemberProfileListContainer = () => { const { meetingId, + meetingName, isOpen, gatherMemberList, searchInput, @@ -40,6 +41,8 @@ export const GatherMemberProfileListContainer = () => { onClose={inviteModalClose} topTitle="모임원들을 모링으로" bottomTitle="초대해보세요!" + shareDescription={`${meetingName} 모임에 여러분들을 초대합니다`} + shareImageUrl="https://file.moring.one/defaults/invite_narrow.png" shareLink={inviteLink} /> diff --git a/packages/web-domains/src/home/features/gather-member/services/useGatherMemberProfileListService.tsx b/packages/web-domains/src/home/features/gather-member/services/useGatherMemberProfileListService.tsx index 4c5c41c8..ffe1d5a9 100644 --- a/packages/web-domains/src/home/features/gather-member/services/useGatherMemberProfileListService.tsx +++ b/packages/web-domains/src/home/features/gather-member/services/useGatherMemberProfileListService.tsx @@ -6,6 +6,7 @@ import { getWebDomain } from '@/common'; import { generateInviteLink } from '@/common/utils/generateInviteLink'; import { getKeywordRegex } from '@/common/utils/getKeywordRegex'; import { useGetInviteCode } from '@/home/common/apis/queries/useGetInviteCode'; +import { useGetMeetingInfo } from '@/home/common/apis/queries/useGetMeetingName'; import { MemberType } from '@/home/common/apis/schema/useGetProgressingQuestionQuery.type'; import { HomeAtoms } from '@/home/common/atoms/home.atom'; @@ -30,6 +31,10 @@ export const useGatherMemberProfileListService = () => { options: { enabled: !!meetingId }, }); + const { data: meetingInfo } = useGetMeetingInfo({}); + + const meetingName = meetingInfo?.meetings.find((meeting) => meeting.meetingId === Number(meetingId))?.name; + const handleChangeSearchInput = (value: string) => { setSearchInput(value); }; @@ -70,6 +75,7 @@ export const useGatherMemberProfileListService = () => { return { meetingId, + meetingName, isOpen, inviteLink: generateInviteLink(inviteCode?.code) ?? `${getWebDomain()}`, searchInput, diff --git a/packages/web-domains/src/relay-question/features/select-relay-question/components/Question/Question.tsx b/packages/web-domains/src/relay-question/features/select-relay-question/components/Question/Question.tsx index a75bfee4..d29330a7 100644 --- a/packages/web-domains/src/relay-question/features/select-relay-question/components/Question/Question.tsx +++ b/packages/web-domains/src/relay-question/features/select-relay-question/components/Question/Question.tsx @@ -19,7 +19,7 @@ interface QuestionProps { export const Question = ({ id, imageUrl, title, usedCount, meetingId }: QuestionProps) => { const openModal = useModal(); - const { refetch } = useRelayQuestionQuery(1); + const { refetch } = useRelayQuestionQuery(id); const router = useRouter(); diff --git a/packages/web-domains/src/relay-question/features/share-group/containers/CurrentRelayQuestionCountContainer/CurrentRelayQuestionCountContainer.tsx b/packages/web-domains/src/relay-question/features/share-group/containers/CurrentRelayQuestionCountContainer/CurrentRelayQuestionCountContainer.tsx index a28a2f95..3374a3c9 100644 --- a/packages/web-domains/src/relay-question/features/share-group/containers/CurrentRelayQuestionCountContainer/CurrentRelayQuestionCountContainer.tsx +++ b/packages/web-domains/src/relay-question/features/share-group/containers/CurrentRelayQuestionCountContainer/CurrentRelayQuestionCountContainer.tsx @@ -37,7 +37,7 @@ export const CurrentRelayQuestionCountContainer = () => { if (!activeQuestion || !data) return; - const currentMeetingName = data.meetings.find(({ meetingId }) => meetingId === Number(meetingId))?.name; + const currentMeetingName = data.meetings.find((meeting) => meeting.meetingId === Number(meetingId))?.name; return ( <> @@ -89,7 +89,7 @@ export const CurrentRelayQuestionCountContainer = () => { topTitle="모임원들에게 릴레이 질문을" bottomTitle="공유해 보세요!" shareImageUrl={KAKAO_IMAGE_URL} - shareDescription={`새로운 질문이 도착했어요! 지금 바로 답변 하러 가볼까요? 다음 질문인은 ${activeQuestion.targetMember.name}님이에요`} + shareDescription={`새로운 질문이 도착했어요! 지금 바로 답변 하러 가볼까요? 다음 질문인은 ${activeQuestion?.nextTargetMember?.name || '000'}님이에요`} shareLink={`${getWebDomain()}/${meetingId}/answer/opening`} />