みてるぞ
6d82e38d56
Merge branch 'main' into feature/134 #134 細部 #134 Co-authored-by: miteruzo <miteruzo@naver.com> Reviewed-on: #135
26 lines
794 B
TypeScript
26 lines
794 B
TypeScript
import { Link } from 'react-router-dom'
|
|
|
|
import type { FC, MouseEvent } from 'react'
|
|
|
|
import type { Post } from '@/types'
|
|
|
|
type Props = { posts: Post[]
|
|
onClick?: (event: MouseEvent<HTMLElement>) => void }
|
|
|
|
|
|
export default (({ posts, onClick }: Props) => (
|
|
<div className="flex flex-wrap gap-6 p-4">
|
|
{posts.map ((post, i) => (
|
|
<Link to={`/posts/${ post.id }`}
|
|
key={post.id}
|
|
className="w-40 h-40 overflow-hidden rounded-lg shadow-md hover:shadow-lg"
|
|
onClick={onClick}>
|
|
<img src={post.thumbnail || post.thumbnailBase || undefined}
|
|
alt={post.title || post.url}
|
|
title={post.title || post.url || undefined}
|
|
loading={i < 12 ? 'eager' : 'lazy'}
|
|
decoding="async"
|
|
className="object-cover w-full h-full"/>
|
|
</Link>))}
|
|
</div>)) satisfies FC<Props>
|