85 lines
2.0 KiB
JavaScript
85 lines
2.0 KiB
JavaScript
import React, { Component, Fragment } from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import { connect } from 'react-redux';
|
|
import styled from 'styled-components';
|
|
import ReCaptcha from './ReCaptcha';
|
|
import showRecaptcha from '../../helpers/recaptcha';
|
|
|
|
const Wrapper = styled.footer`
|
|
width: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
padding: 4px 0 ${({ isAuthenticated }) => (isAuthenticated ? '8px' : '24px')};
|
|
background-color: white;
|
|
|
|
a {
|
|
text-decoration: none;
|
|
color: #2196f3;
|
|
}
|
|
`;
|
|
|
|
const Text = styled.p`
|
|
font-size: 13px;
|
|
font-weight: 300;
|
|
color: #666;
|
|
|
|
@media only screen and (max-width: 768px) {
|
|
font-size: 11px;
|
|
}
|
|
`;
|
|
|
|
class Footer extends Component {
|
|
componentDidMount() {
|
|
showRecaptcha();
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<Wrapper isAuthenticated={this.props.isAuthenticated}>
|
|
{!this.props.isAuthenticated && <ReCaptcha />}
|
|
<Text>
|
|
Made with love by{' '}
|
|
<a href="//thedevs.network/" title="The Devs">
|
|
The Devs
|
|
</a>
|
|
.{' | '}
|
|
<a
|
|
href="https://github.com/thedevs-network/kutt"
|
|
title="GitHub"
|
|
target="_blank"
|
|
>
|
|
GitHub
|
|
</a>
|
|
{' | '}
|
|
<a href="/terms" title="Terms of Service">
|
|
Terms of Service
|
|
</a>
|
|
{' | '}
|
|
<a href="/report" title="Report abuse">
|
|
Report Abuse
|
|
</a>
|
|
{process.env.CONTACT_EMAIL && (
|
|
<Fragment>
|
|
{' | '}
|
|
<a href={`mailto:${process.env.CONTACT_EMAIL}`} title="Contact us">
|
|
Contact us
|
|
</a>
|
|
</Fragment>
|
|
)}
|
|
.
|
|
</Text>
|
|
</Wrapper>
|
|
);
|
|
}
|
|
}
|
|
|
|
Footer.propTypes = {
|
|
isAuthenticated: PropTypes.bool.isRequired,
|
|
};
|
|
|
|
const mapStateToProps = ({ auth: { isAuthenticated } }) => ({ isAuthenticated });
|
|
|
|
export default connect(mapStateToProps)(Footer);
|