2018-05-11 21:44:34 +02:00
|
|
|
import React, { PureComponent } from 'react'
|
2019-04-16 03:59:21 +02:00
|
|
|
import PropTypes from 'prop-types'
|
2019-06-10 23:06:55 +02:00
|
|
|
import { StaticQuery, graphql } from 'gatsby'
|
2019-01-04 14:19:34 +01:00
|
|
|
import classNames from 'classnames'
|
2018-05-13 00:42:59 +02:00
|
|
|
import Vcard from '../atoms/Vcard'
|
2018-09-15 19:51:10 +02:00
|
|
|
import LogoUnit from '../molecules/LogoUnit'
|
2018-05-12 22:58:16 +02:00
|
|
|
import Networks from '../molecules/Networks'
|
2018-06-11 19:48:38 +02:00
|
|
|
import styles from './Footer.module.scss'
|
2018-04-02 23:22:48 +02:00
|
|
|
|
2018-09-06 11:34:50 +02:00
|
|
|
const query = graphql`
|
|
|
|
query {
|
|
|
|
# the package.json file
|
|
|
|
portfolioJson {
|
|
|
|
bugs
|
|
|
|
}
|
|
|
|
|
2019-05-26 16:55:56 +02:00
|
|
|
metaYaml {
|
2018-09-06 11:34:50 +02:00
|
|
|
title
|
2019-01-04 14:19:34 +01:00
|
|
|
url
|
2018-09-06 11:34:50 +02:00
|
|
|
gpg
|
|
|
|
}
|
|
|
|
}
|
|
|
|
`
|
|
|
|
|
2019-04-16 21:21:01 +02:00
|
|
|
const FooterMarkup = ({ pkg, meta, year }) => {
|
2019-04-16 03:59:21 +02:00
|
|
|
const classes = classNames('h-card', [styles.footer])
|
2019-01-04 14:19:34 +01:00
|
|
|
|
2019-04-16 03:59:21 +02:00
|
|
|
return (
|
2019-01-04 14:19:34 +01:00
|
|
|
<footer className={classes}>
|
2019-06-10 23:06:55 +02:00
|
|
|
<LogoUnit minimal />
|
2018-09-06 14:28:01 +02:00
|
|
|
|
2018-11-25 01:52:31 +01:00
|
|
|
<Networks minimal />
|
2018-09-06 14:28:01 +02:00
|
|
|
|
2019-01-04 14:19:34 +01:00
|
|
|
<p className={styles.actions}>
|
2018-11-25 01:52:31 +01:00
|
|
|
<Vcard />
|
2019-01-04 14:19:34 +01:00
|
|
|
<a className="u-key" href={meta.gpg}>
|
|
|
|
PGP/GPG key
|
|
|
|
</a>
|
2018-11-25 01:52:31 +01:00
|
|
|
<a href={pkg.bugs}>Found a bug?</a>
|
|
|
|
</p>
|
2019-01-04 14:19:34 +01:00
|
|
|
<p className={styles.copyright}>
|
2018-11-25 01:52:31 +01:00
|
|
|
<small>
|
2019-01-04 14:19:34 +01:00
|
|
|
© {year}{' '}
|
|
|
|
<a className="u-url" href={meta.url}>
|
|
|
|
{meta.title}
|
|
|
|
</a>{' '}
|
|
|
|
— All Rights Reserved
|
2018-11-25 01:52:31 +01:00
|
|
|
</small>
|
|
|
|
</p>
|
|
|
|
</footer>
|
|
|
|
)
|
2019-04-16 03:59:21 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
FooterMarkup.propTypes = {
|
|
|
|
pkg: PropTypes.object.isRequired,
|
|
|
|
meta: PropTypes.object.isRequired,
|
|
|
|
year: PropTypes.number.isRequired
|
|
|
|
}
|
|
|
|
|
|
|
|
export default class Footer extends PureComponent {
|
|
|
|
state = { year: new Date().getFullYear() }
|
2018-05-06 18:38:40 +02:00
|
|
|
|
|
|
|
render() {
|
|
|
|
return (
|
2018-06-23 17:19:45 +02:00
|
|
|
<StaticQuery
|
2018-09-06 11:34:50 +02:00
|
|
|
query={query}
|
2018-06-23 17:19:45 +02:00
|
|
|
render={data => {
|
|
|
|
const pkg = data.portfolioJson
|
2019-05-26 16:55:56 +02:00
|
|
|
const meta = data.metaYaml
|
2018-06-23 17:19:45 +02:00
|
|
|
|
2019-04-16 03:59:21 +02:00
|
|
|
return <FooterMarkup year={this.state.year} pkg={pkg} meta={meta} />
|
2018-06-23 17:19:45 +02:00
|
|
|
}}
|
|
|
|
/>
|
2018-05-06 18:38:40 +02:00
|
|
|
)
|
|
|
|
}
|
2018-04-02 23:22:48 +02:00
|
|
|
}
|