-
Notifications
You must be signed in to change notification settings - Fork 0
/
RepoItem.tsx
42 lines (39 loc) · 1.24 KB
/
RepoItem.tsx
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
import { FaEye, FaInfo, FaLink, FaStar, FaUtensils } from 'react-icons/fa';
import { RepoType } from '../../context/github/GithubContext';
export default function RepoItem({ repo }: { repo: RepoType }): JSX.Element {
const {
name,
description,
html_url,
forks,
open_issues,
watchers_count,
stargazers_count,
} = repo;
return (
<div className='mb-2 rounded-md card bg-base-200 hover:bg-base-300'>
<div className='card-body'>
<h3 className='mb-2 text-xl font-semibold'>
<a href={html_url}>
<FaLink className='inline mr-1' /> {name}
</a>
</h3>
<p className='mb-3'>{description}</p>
<div>
<div className='mr-2 badge badge-info badge-lg'>
<FaEye className='mr-2' /> {watchers_count}
</div>
<div className='mr-2 badge badge-success badge-lg'>
<FaStar className='mr-2' /> {stargazers_count}
</div>
<div className='mr-2 badge badge-error badge-lg'>
<FaInfo className='mr-2' /> {open_issues}
</div>
<div className='mr-2 badge badge-warning badge-lg'>
<FaUtensils className='mr-2' /> {forks}
</div>
</div>
</div>
</div>
);
}