Skip to content

Commit 9726cf7

Browse files
PuterismPuterism
authored
Merge pull request #236 from Nexters/develop
[운영배포] 공연 정보 및 미리보기 관련 수정사항 반영
2 parents 5f4e79a + 49bc28f commit 9726cf7

File tree

34 files changed

+576
-336
lines changed

34 files changed

+576
-336
lines changed

‎apps/admin/src/components/AuthoritySettingDialogContent/components/HostListItem/index.tsx‎

Lines changed: 2 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { useDropdown } from '@boolti/ui';
22
import Styled from './HostListItem.styles';
33
import { HostListItem as IHostListItem, HostType, HostTypeInfo } from '@boolti/api/src/types/host';
4-
import { CheckIcon, ChevronDownIcon } from '@boolti/icon';
4+
import { CheckIcon, ChevronDownIcon, UserIcon } from '@boolti/icon';
55
import { useAtom } from 'jotai';
66
import { myHostInfoAtom } from '~/components/ShowDetailLayout';
77

@@ -11,25 +11,6 @@ interface HostListItemProps {
1111
onEdit: (host: IHostListItem, type: HostType) => void;
1212
}
1313

14-
const ProfileSVG = () => (
15-
<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
16-
<circle cx="18" cy="18" r="18" fill="#E7EAF2" />
17-
<mask id="mask0_7956_29535" maskUnits="userSpaceOnUse" x="0" y="0" width="36" height="36">
18-
<circle cx="18" cy="18" r="18" fill="#2E303A" />
19-
</mask>
20-
<g mask="url(#mask0_7956_29535)">
21-
<path
22-
d="M31.9496 36.9V32.85C31.9496 30.7017 31.0962 28.6415 29.5772 27.1224C28.0581 25.6034 25.9979 24.75 23.8496 24.75H11.6996C9.55136 24.75 7.49109 25.6034 5.97204 27.1224C4.453 28.6415 3.59961 30.7017 3.59961 32.85V36.9"
23-
fill="#C8CCDC"
24-
/>
25-
<path
26-
d="M17.9992 22.05C21.4786 22.05 24.2992 19.2294 24.2992 15.75C24.2992 12.2706 21.4786 9.45001 17.9992 9.45001C14.5198 9.45001 11.6992 12.2706 11.6992 15.75C11.6992 19.2294 14.5198 22.05 17.9992 22.05Z"
27-
fill="#C8CCDC"
28-
/>
29-
</g>
30-
</svg>
31-
);
32-
3314
const dropdownItems: HostTypeInfo[] = [
3415
{
3516
type: HostType.MANAGER,
@@ -80,11 +61,7 @@ const HostListItem = ({ host, onEdit, onDelete }: HostListItemProps) => {
8061
return (
8162
<Styled.HostListItem key={host.hostId}>
8263
<Styled.HostInfoWrapper>
83-
{host.imagePath ? (
84-
<Styled.HostImage src={host.imagePath} alt="host image" />
85-
) : (
86-
<ProfileSVG />
87-
)}
64+
{host.imagePath ? <Styled.HostImage src={host.imagePath} alt="host image" /> : <UserIcon />}
8865
<Styled.HostName>{host.hostName}</Styled.HostName>
8966
{host.self && <Styled.HostSelfLabel>(나)</Styled.HostSelfLabel>}
9067
</Styled.HostInfoWrapper>

‎apps/admin/src/components/Layout/Layout.styles.ts‎

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -25,12 +25,7 @@ const BannerContainer = styled.div`
2525
`;
2626

2727
const Banner = styled.div`
28-
max-width: ${({ theme }) => theme.breakpoint.desktop};
2928
min-height: 56px;
30-
margin: 0 auto;
31-
display: flex;
32-
align-items: center;
33-
padding: 0 20px;
3429
`;
3530

3631
const ContentContainer = styled.div`

‎apps/admin/src/components/ProfileDropdown/index.tsx‎

Lines changed: 2 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { queryKeys, useLogout, useQueryClient } from '@boolti/api';
2-
import { ChevronDownIcon, ChevronUpIcon, LogoutIcon, SettingIcon } from '@boolti/icon';
2+
import { ChevronDownIcon, ChevronUpIcon, LogoutIcon, SettingIcon, UserIcon } from '@boolti/icon';
33
import { useConfirm, useDialog, useDropdown } from '@boolti/ui/src/hooks';
44
import { useNavigate } from 'react-router-dom';
55

@@ -16,26 +16,6 @@ interface ProfileDropdownProps {
1616
onClick?: () => void;
1717
}
1818

19-
// TODO: UserProfile svg 공통화
20-
const ProfileSVG = () => (
21-
<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
22-
<circle cx="18" cy="18" r="18" fill="#E7EAF2" />
23-
<mask id="mask0_7956_29535" maskUnits="userSpaceOnUse" x="0" y="0" width="36" height="36">
24-
<circle cx="18" cy="18" r="18" fill="#2E303A" />
25-
</mask>
26-
<g mask="url(#mask0_7956_29535)">
27-
<path
28-
d="M31.9496 36.9V32.85C31.9496 30.7017 31.0962 28.6415 29.5772 27.1224C28.0581 25.6034 25.9979 24.75 23.8496 24.75H11.6996C9.55136 24.75 7.49109 25.6034 5.97204 27.1224C4.453 28.6415 3.59961 30.7017 3.59961 32.85V36.9"
29-
fill="#C8CCDC"
30-
/>
31-
<path
32-
d="M17.9992 22.05C21.4786 22.05 24.2992 19.2294 24.2992 15.75C24.2992 12.2706 21.4786 9.45001 17.9992 9.45001C14.5198 9.45001 11.6992 12.2706 11.6992 15.75C11.6992 19.2294 14.5198 22.05 17.9992 22.05Z"
33-
fill="#C8CCDC"
34-
/>
35-
</g>
36-
</svg>
37-
);
38-
3919
const ProfileDropdown = ({ image, open, disabledDropdown, onClick }: ProfileDropdownProps) => {
4020
const { isOpen, toggleDropdown } = useDropdown();
4121
const { removeToken } = useAuthAtom();
@@ -58,7 +38,7 @@ const ProfileDropdown = ({ image, open, disabledDropdown, onClick }: ProfileDrop
5838
}}
5939
>
6040
<Styled.UserProfileImageWrapper>
61-
{image ? <Styled.UserProfileImage src={image} alt="유저 프로필 이미지" /> : <ProfileSVG />}
41+
{image ? <Styled.UserProfileImage src={image} alt="유저 프로필 이미지" /> : <UserIcon />}
6242
</Styled.UserProfileImageWrapper>
6343
<Styled.UserProfileIconWrapper className="icon-wrapper">
6444
{dropdownOpen ? <ChevronUpIcon /> : <ChevronDownIcon />}

‎apps/admin/src/components/ShowCastInfo/index.tsx‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { useDialog } from '@boolti/ui';
22

33
import Styled from './ShowCastInfo.styles';
4-
import { EditIcon, ChevronDownIcon, ChevronUpIcon } from '@boolti/icon';
4+
import { EditIcon, ChevronDownIcon, ChevronUpIcon, UserIcon } from '@boolti/icon';
55
import { useState } from 'react';
66
import ShowCastInfoFormDialogContent, {
77
TempShowCastInfoFormInput,
@@ -71,9 +71,13 @@ const ShowCastInfo = ({ showCastInfo, onSave, onDelete }: Props) => {
7171
>
7272
{members.map((member) => (
7373
<Styled.CastItem key={member.id}>
74-
<Styled.UserImage
75-
style={{ '--imgPath': `url(${member.userImgPath})` } as React.CSSProperties}
76-
/>
74+
{member.userImgPath ? (
75+
<Styled.UserImage
76+
style={{ '--imgPath': `url(${member.userImgPath})` } as React.CSSProperties}
77+
/>
78+
) : (
79+
<UserIcon size={32} />
80+
)}
7781
<Styled.Username>{member.userNickname}</Styled.Username>
7882
<Styled.Rolename>({member.roleName})</Styled.Rolename>
7983
</Styled.CastItem>

‎apps/admin/src/components/ShowCastInfoFormDialogContent/index.tsx‎

Lines changed: 17 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { Controller, useFieldArray, useForm } from 'react-hook-form';
33
import Styled from './ShowCastInfoFormDialogContent.styles';
44
import { useState } from 'react';
55
import { useBodyScrollLock } from '~/hooks/useBodyScrollLock';
6-
import { ClearIcon, PlusIcon, TrashIcon } from '@boolti/icon';
6+
import { ClearIcon, PlusIcon, TrashIcon, UserIcon } from '@boolti/icon';
77
import { Member, queryKeys, useQueryClient } from '@boolti/api';
88
import { replaceUserCode } from '~/utils/replace';
99

@@ -61,9 +61,9 @@ const ShowCastInfoFormDialogContent = ({ onDelete, prevShowCastInfo, onSave }: P
6161
!getValues('name') ||
6262
((memberFieldState.isDirty || memberFieldState.isTouched) &&
6363
controlledFields.some(
64-
({ userImgPath, userNickname, roleName }, index) =>
64+
({ userNickname, roleName }, index) =>
6565
(isMemberFieldBlurred[index].roleName || isMemberFieldBlurred[index].userCode) &&
66-
(!userImgPath || !userNickname || !roleName),
66+
(!userNickname || !roleName),
6767
));
6868

6969
return (
@@ -102,22 +102,24 @@ const ShowCastInfoFormDialogContent = ({ onDelete, prevShowCastInfo, onSave }: P
102102
render={({ field: { onChange, onBlur } }) => {
103103
const value = field.userCode;
104104
const isError = Boolean(
105-
isMemberFieldBlurred[index].userCode
106-
? !value || !field.userImgPath || !field.userNickname
107-
: false,
105+
isMemberFieldBlurred[index].userCode ? !value || !field.userNickname : false,
108106
);
109107
return (
110108
<Styled.FieldWrap>
111109
<Styled.InputWrapper isError={isError}>
112-
{field.userImgPath && field.userNickname ? (
110+
{field.userNickname ? (
113111
<>
114-
<Styled.UserImage
115-
style={
116-
{
117-
'--imgPath': `url(${field.userImgPath})`,
118-
} as React.CSSProperties
119-
}
120-
/>
112+
{field.userImgPath ? (
113+
<Styled.UserImage
114+
style={
115+
{
116+
'--imgPath': `url(${field.userImgPath})`,
117+
} as React.CSSProperties
118+
}
119+
/>
120+
) : (
121+
<UserIcon size={32} />
122+
)}
121123
<Styled.Username>{field.userNickname}</Styled.Username>
122124
<Styled.RemoveButton
123125
onClick={() => {
@@ -278,8 +280,7 @@ const ShowCastInfoFormDialogContent = ({ onDelete, prevShowCastInfo, onSave }: P
278280

279281
const name = getValues('name');
280282
const members = (getValues('members') ?? []).filter(
281-
(member) =>
282-
member.userImgPath && member.userNickname && member.roleName && member.userCode,
283+
(member) => member.userNickname && member.roleName && member.userCode,
283284
);
284285

285286
try {

0 commit comments

Comments
 (0)