From 8fe09100c60a0fff799191008ab277c802f5de93 Mon Sep 17 00:00:00 2001 From: leejeongho <92032081+LeeJeongHooo@users.noreply.github.com> Date: Sat, 14 Sep 2024 00:32:35 +0900 Subject: [PATCH] =?UTF-8?q?fix(web-domains):=20Home=20Layout=20padding=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD,=20Empty=20View=20=EC=82=AD=EC=A0=9C,=20?= =?UTF-8?q?=EB=AA=A8=EC=9E=84=ED=99=88=20=EB=94=94=EC=9E=90=EC=9D=B8=20?= =?UTF-8?q?=EC=A0=95=EC=9D=98=EC=84=9C=20=EC=97=85=EB=8D=B0=EC=9D=B4?= =?UTF-8?q?=ED=8A=B8=20(#206)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix: Home Layout padding 변경 * fix: 홈 EMPTY VIEW 삭제 및 본인 프로필 나로 표시 * fix: 모임 표시 왕관 아이콘 적용 * fix: handWavingStatus에 따른 모임원 프로필 디자인 수정 * fix: 본인 프로필인 경우 마이로 이동 * fix: 모임리스트 본인 추가로 인한 릴레이 질문 시작 변경 --- .../components/Icon/assets/ConnectStar.tsx | 4 +- .../useGetProgressingQuestionQuery.type.ts | 4 ++ .../common/components/Layout/HomeLayout.tsx | 2 +- .../common/constants/meetingActivatedLimit.ts | 1 + .../services/useFloatingButtonService.ts | 3 +- .../GatherMemberProfile.tsx | 53 ++++++++++++++----- .../GatherMemberProfileListContainer.tsx | 5 -- .../services/useNotificationService.ts | 3 +- .../useProgressingQuestionService.tsx | 3 +- 9 files changed, 53 insertions(+), 25 deletions(-) create mode 100644 packages/web-domains/src/home/common/constants/meetingActivatedLimit.ts diff --git a/packages/core/sds/src/components/Icon/assets/ConnectStar.tsx b/packages/core/sds/src/components/Icon/assets/ConnectStar.tsx index e1bcaf15..d4272452 100644 --- a/packages/core/sds/src/components/Icon/assets/ConnectStar.tsx +++ b/packages/core/sds/src/components/Icon/assets/ConnectStar.tsx @@ -1,11 +1,11 @@ import { IconAssetProps } from '../types'; export const ConnectStar = (props: IconAssetProps) => { - const { size = 20 } = props; + const { size = 20, color } = props; return ( - + { - return
{children}
; + return
{children}
; }; diff --git a/packages/web-domains/src/home/common/constants/meetingActivatedLimit.ts b/packages/web-domains/src/home/common/constants/meetingActivatedLimit.ts new file mode 100644 index 00000000..225b5cdd --- /dev/null +++ b/packages/web-domains/src/home/common/constants/meetingActivatedLimit.ts @@ -0,0 +1 @@ +export const MEETING_ACTIVATED_LIMIT = 2; diff --git a/packages/web-domains/src/home/features/floating-button/services/useFloatingButtonService.ts b/packages/web-domains/src/home/features/floating-button/services/useFloatingButtonService.ts index 7a7af519..6181e7bd 100644 --- a/packages/web-domains/src/home/features/floating-button/services/useFloatingButtonService.ts +++ b/packages/web-domains/src/home/features/floating-button/services/useFloatingButtonService.ts @@ -4,6 +4,7 @@ import { useEffect, useState } from 'react'; import { useDialogContext } from '@/common/contexts/DialogProvider'; import { useGetGatherMemberList } from '@/home/common/apis/queries/useGetGatherMemberList'; import { HomeAtoms } from '@/home/common/atoms/home.atom'; +import { MEETING_ACTIVATED_LIMIT } from '@/home/common/constants/meetingActivatedLimit'; export const useFloatingButtonService = () => { const currentMeeting = useAtomValue(HomeAtoms.currentMeeting); @@ -49,7 +50,7 @@ export const useFloatingButtonService = () => { close(); }; - const isOnlyOne = !!memberList && memberList.contents.length < 1; + const isOnlyOne = !!memberList && memberList.contents.length < MEETING_ACTIVATED_LIMIT; return { meetingId: currentMeeting?.meetingId, diff --git a/packages/web-domains/src/home/features/gather-member/components/GatherMemberProfile/GatherMemberProfile.tsx b/packages/web-domains/src/home/features/gather-member/components/GatherMemberProfile/GatherMemberProfile.tsx index 2ee49f41..77519323 100644 --- a/packages/web-domains/src/home/features/gather-member/components/GatherMemberProfile/GatherMemberProfile.tsx +++ b/packages/web-domains/src/home/features/gather-member/components/GatherMemberProfile/GatherMemberProfile.tsx @@ -3,7 +3,7 @@ import { colors } from '@sds/theme'; import Link from 'next/link'; import { Avatar } from '@/common/components/Avatar/Avatar'; -import { MemberType } from '@/home/common/apis/schema/useGetProgressingQuestionQuery.type'; +import { HandWavingStatusType, MemberType } from '@/home/common/apis/schema/useGetProgressingQuestionQuery.type'; interface GatherMemberProfileProps { meetingId: number; @@ -11,7 +11,7 @@ interface GatherMemberProfileProps { } export const GatherMemberProfile = ({ meetingId, member }: GatherMemberProfileProps) => { - const { name, role, profileImageFileUrl, meetingMemberId, isHandWaved } = member; + const { name, role, profileImageFileUrl, meetingMemberId, isHandWaved, isMe, handWavingStatus } = member; const isOwner = role === 'OWNER'; return ( @@ -25,16 +25,16 @@ export const GatherMemberProfile = ({ meetingId, member }: GatherMemberProfilePr padding: '12px 16px', }} > - +
- + - {name} - {isOwner && ( - - 👑 - - )} + {isMe ? '나' : name}
@@ -42,12 +42,37 @@ export const GatherMemberProfile = ({ meetingId, member }: GatherMemberProfilePr ); }; -const ProfileImage = ({ imageUrl, isConnection = false }: { imageUrl?: string; isConnection?: boolean }) => { - const borderStyles = isConnection ? { border: `3px solid ${colors.primary500}` } : {}; +interface ProfileImageProps { + imageUrl?: string; + isConnection?: boolean; + isOnwer?: boolean; + handWavingStatus: HandWavingStatusType; +} + +const ProfileImage = ({ imageUrl, isConnection = false, isOnwer = false, handWavingStatus }: ProfileImageProps) => { + const isHandWaving = isConnection || handWavingStatus === 'REQUESTED' || handWavingStatus === 'ACCEPTED'; + + const color = handWavingStatus === 'ACCEPTED' ? colors.primary500 : colors.grey500; return ( - - {isConnection && } + + {isHandWaving && ( + + )} + {isOnwer && ( + + )} ); 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 40254309..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 @@ -3,7 +3,6 @@ import { Icon } from '@sds/components'; import { KakaoShareModal } from '@/common'; -import { EmptyView } from '@/common/components'; import { GatherMemberProfileList } from '../components/GatherMemberProfile/GatherMemberProfileList'; import { GatherMemberSearchInput } from '../components/GatherMemberSearch/GatherMemberSearchInput'; @@ -22,10 +21,6 @@ export const GatherMemberProfileListContainer = () => { inviteModalOpen, } = useGatherMemberProfileListService(); - if (!gatherMemberList.length) { - return ; - } - return (
diff --git a/packages/web-domains/src/home/features/notification/services/useNotificationService.ts b/packages/web-domains/src/home/features/notification/services/useNotificationService.ts index 4c7c0f3e..4e90f7a6 100644 --- a/packages/web-domains/src/home/features/notification/services/useNotificationService.ts +++ b/packages/web-domains/src/home/features/notification/services/useNotificationService.ts @@ -11,6 +11,7 @@ import { useGetNotification } from '@/home/common/apis/queries/useGetNotificatio import { NotificationType } from '@/home/common/apis/schema/Notification.schema'; import { ProgressingQuestionType } from '@/home/common/apis/schema/useGetProgressingQuestionQuery.type'; import { HomeAtoms } from '@/home/common/atoms/home.atom'; +import { MEETING_ACTIVATED_LIMIT } from '@/home/common/constants/meetingActivatedLimit'; export const useNotificationService = () => { const queryClient = useQueryClient(); @@ -72,7 +73,7 @@ export const useNotificationService = () => { } }, [notfication, currentMeeting]); - const isOnlyOne = !!memberList && memberList.contents.length < 1; + const isOnlyOne = !!memberList && memberList.contents.length < MEETING_ACTIVATED_LIMIT; return { meetingId, diff --git a/packages/web-domains/src/home/features/progressing-question/services/useProgressingQuestionService.tsx b/packages/web-domains/src/home/features/progressing-question/services/useProgressingQuestionService.tsx index eb192f0a..0a0789c2 100644 --- a/packages/web-domains/src/home/features/progressing-question/services/useProgressingQuestionService.tsx +++ b/packages/web-domains/src/home/features/progressing-question/services/useProgressingQuestionService.tsx @@ -5,6 +5,7 @@ import { useEffect, useState } from 'react'; import { useGetGatherMemberList } from '@/home/common/apis/queries/useGetGatherMemberList'; import { useGetMyInfo } from '@/home/common/apis/queries/useGetMyInfo'; import { HomeAtoms } from '@/home/common/atoms/home.atom'; +import { MEETING_ACTIVATED_LIMIT } from '@/home/common/constants/meetingActivatedLimit'; import { useSetCurrentMeeting } from '@/home/common/hooks/useSetCurrentMeeting'; import { useGetProgressingQuestion } from '../../../common/apis/queries/useGetProgressingQuestion'; @@ -75,7 +76,7 @@ export const useProgressingQuestionService = () => { } }, [progressingQuestion, myInfo]); - const isOnlyOne = !!memberList && memberList.contents.length < 1; + const isOnlyOne = !!memberList && memberList.contents.length < MEETING_ACTIVATED_LIMIT; return { isOnlyOne,