All files / src/components/shared/card/card-thumbnail index.tsx

100% Statements 28/28
100% Branches 2/2
100% Functions 1/1
100% Lines 28/28

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 291x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 6x 6x 6x 6x 6x 6x 6x 6x 6x 6x 6x 6x 6x 6x 6x 6x 6x  
import { GroupImage } from '@/components/shared/group-image';
import { PendingBadge } from '@/components/ui';
 
type CardThumbnailProps = {
  title: string;
  thumbnail?: string | null;
  isPending?: boolean;
  isFinished?: boolean;
};
 
export const CardThumbnail = ({ thumbnail, isPending, isFinished }: CardThumbnailProps) => {
  return (
    <div className='relative size-25 shrink-0'>
      <GroupImage size='lg' src={thumbnail ?? null} />
 
      {isPending && (
        <div className='absolute top-1.5 left-1.5'>
          <PendingBadge variant='sm'>대기중</PendingBadge>
        </div>
      )}
      {isFinished && (
        <div className='flex-center absolute inset-0 rounded-2xl bg-black/60'>
          <span className='text-text-sm-bold text-mono-white'>모임 마감</span>
        </div>
      )}
    </div>
  );
};