1 import React from 'react'
2 import {Avatar, Text} from '@primer/react'
3 import {Tooltip} from '@primer/react/next'
4 import {PencilIcon} from '@primer/octicons-react'
5 import Link from './link'
6 import usePage from '../hooks/use-page'
7
8 import * as styles from './page-footer.module.css'
9
10 const months = [
11 'January',
12 'February',
13 'March',
14 'April',
15 'May',
16 'June',
17 'July',
18 'August',
19 'September',
20 'October',
21 'November',
22 'December',
23 ]
24
25 const format = d => `${months[d.getMonth()]} ${d.getDate()}, ${d.getFullYear()}`
26
27 const pluralize = (word, count) => `${word}${count === 1 ? '' : 's'}`
28
29 const Contributors = ({contributors = [], latestCommit}) => {
30 if (!contributors.length) {
31 return null
32 }
33
34 return (
35 <>
36 <div className={styles.Box}>
37 <Text className={styles.Text}>
38 {contributors.length} {pluralize('contributor', contributors.length)}
39 </Text>
40 {contributors.map(login => (
41 <Tooltip key={login} text={login}>
42 <Link href={`https://github.com/${login}`} className={styles.Link}>
43 <Avatar src={`https://github.com/${login}.png?size=40`} alt={login} />
44 </Link>
45 </Tooltip>
46 ))}
47 </div>
48 {latestCommit ? (
49 <Text className={styles.Text_1}>
50 Last edited by{' '}
51 <Link href={`https://github.com/${latestCommit.login}`} showUnderline={true}>
52 {latestCommit.login}
53 </Link>{' '}
54 on{' '}
55 <Link href={latestCommit.url} showUnderline={true}>
56 {format(new Date(latestCommit.date))}
57 </Link>
58 </Text>
59 ) : null}
60 </>
61 )
62 }
63
64 const PageFooter = () => {
65 const {editUrl, latestCommit, contributors = []} = usePage().pageContext
66
67 if (!editUrl && !contributors.length) {
68 return null
69 }
70
71 return (
72 <div className={styles.Box_1}>
73 <div className={styles.Box_2}>
74 {editUrl ? (
75 <Link href={editUrl}>
76 <PencilIcon className={styles.Text} />
77 Edit this page on GitHub
78 </Link>
79 ) : null}
80 <Contributors contributors={contributors} latestCommit={latestCommit} />
81 </div>
82 </div>
83 )
84 }
85
86 export default PageFooter