static-cms/src/backends/github/AuthenticationPage.js
Andrey Okonetchnikov 4d696f2253 Login workflow (#137)
* Use collection label instead of name on the CollectionPage

* Added Avatar and logout menu item

* [feat](login) Added userpic with a logout action in the dropdown.

- Display logged in user in the AppHeader
- Implemented logout action and store + tests
- Better styles for GitHub sign in screen

Closes #100

* Better styles for the AppHeader
2016-11-01 11:35:20 -02:00

49 lines
1.2 KiB
JavaScript

import React from 'react';
import Button from 'react-toolbox/lib/button';
import Authenticator from '../../lib/netlify-auth';
import { Icon } from '../../components/UI';
import styles from './AuthenticationPage.css';
export default class AuthenticationPage extends React.Component {
static propTypes = {
onLogin: React.PropTypes.func.isRequired,
};
state = {};
handleLogin = (e) => {
e.preventDefault();
let auth;
if (document.location.host.split(':')[0] === 'localhost') {
auth = new Authenticator({ site_id: 'cms.netlify.com' });
} else {
auth = new Authenticator();
}
auth.authenticate({ provider: 'github', scope: 'repo' }, (err, data) => {
if (err) {
this.setState({ loginError: err.toString() });
return;
}
this.props.onLogin(data);
});
};
render() {
const { loginError } = this.state;
return (
<section className={styles.root}>
{loginError && <p>{loginError}</p>}
<Button
className={styles.button}
raised
onClick={this.handleLogin}
>
<Icon type="github" /> Login with GitHub
</Button>
</section>
);
}
}