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 | 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x 3x | 'use client';
import { Button } from '@/components/ui';
import { useFollowUser, useUnfollowUser } from '@/hooks/use-user';
import { User } from '@/types/service/user';
import { ProfileCard } from '../profile-card';
import { ProfileDescription } from '../profile-description';
import { ProfileFollowsBadge } from '../profile-follows-badge';
interface Props {
user: User;
}
export const ProfileInfo = ({ user }: Props) => {
const { mutate: followUser } = useFollowUser();
const { mutate: unfollowUser } = useUnfollowUser();
const handleFollowClick = () => {
followUser({ followNickname: user.nickName });
};
const handleUnfollowClick = () => {
unfollowUser({ unFollowNickname: user.nickName });
};
return (
<section className='px-4 py-8'>
<ProfileCard user={user} />
<ProfileFollowsBadge user={user} />
{!user.isFollow && <Button onClick={handleFollowClick}>팔로우 하기</Button>}
{user.isFollow && (
<Button variant='tertiary' onClick={handleUnfollowClick}>
팔로우 취소
</Button>
)}
<ProfileDescription user={user} />
</section>
);
};
|