Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 | 1x 1x 1x 1x 1x 1x 1x 1x 10x 10x 10x 10x 10x 10x 1x 1x 1x 1x 1x 1x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x 10x | import { User } from '@/types/service/user';
import {
ProfileDescriptionBadge,
ProfileDescriptionBadgeProps,
} from '../profile-description-badge';
const formatISO = (dateString: string) => {
const date = new Date(dateString);
const y = date.getFullYear();
const m = String(date.getMonth() + 1).padStart(2, '0');
const d = String(date.getDate()).padStart(2, '0');
return `${y}. ${m}. ${d}`;
};
interface Props {
user: User;
}
export const ProfileDescription = ({ user }: Props) => {
const listMap: ProfileDescriptionBadgeProps[] = [
{
label: 'MBTI',
iconId: 'symbol',
value: user.mbti,
},
{
label: '가입 일자',
iconId: 'calendar-2',
value: formatISO(user.createdAt),
},
{
label: '모임 참여',
iconId: 'users-2',
value: `${user.groupJoinedCnt}회`,
},
{
label: '모임 생성',
iconId: 'map-pin-2',
value: `${user.groupCreatedCnt}회`,
},
];
return (
<div className='bg-mono-white shadow-card mt-6 flex flex-col gap-5 rounded-3xl px-6 py-6.25'>
{listMap.map((item) => (
<ProfileDescriptionBadge key={item.label} badgeItems={item} />
))}
</div>
);
};
|