63 lines
1.8 KiB
JavaScript
63 lines
1.8 KiB
JavaScript
import React from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import { Meteor } from 'meteor/meteor';
|
|
import { Bert } from 'meteor/themeteorchef:bert';
|
|
import Icon from '../Icon/Icon';
|
|
import { translate, Trans } from 'react-i18next';
|
|
import { T9n } from 'meteor-accounts-t9n';
|
|
|
|
import './OAuthLoginButton.scss';
|
|
|
|
const handleLogin = (service, callback) => {
|
|
const options = {
|
|
facebook: {
|
|
requestPermissions: ['email'],
|
|
loginStyle: 'popup',
|
|
},
|
|
github: {
|
|
requestPermissions: ['user:email'],
|
|
loginStyle: 'popup',
|
|
},
|
|
google: {
|
|
requestPermissions: ['email', 'profile'],
|
|
requestOfflineToken: true,
|
|
loginStyle: 'popup',
|
|
},
|
|
}[service];
|
|
|
|
return {
|
|
facebook: Meteor.loginWithFacebook,
|
|
github: Meteor.loginWithGithub,
|
|
google: Meteor.loginWithGoogle,
|
|
}[service](options, callback);
|
|
};
|
|
|
|
const serviceLabel = {
|
|
facebook: <span><Icon icon="facebook-official" /> <Trans parent="span">Log In with Facebook</Trans></span>,
|
|
github: <span><Icon icon="github" /> <Trans parent="span">Log In with GitHub</Trans></span>,
|
|
google: <span><Icon icon="google" /> <Trans parent="span">Iniciar sesión con Google</Trans></span>,
|
|
};
|
|
|
|
const OAuthLoginButton = ({ service, callback }) => (
|
|
<button
|
|
className={`btn btn-block btn-raised btn-danger OAuthLoginButton OAuthLoginButton-${service}`}
|
|
type="button"
|
|
onClick={() => handleLogin(service, callback)}
|
|
>
|
|
{serviceLabel[service]}
|
|
</button>
|
|
);
|
|
|
|
OAuthLoginButton.defaultProps = {
|
|
callback: (error) => {
|
|
if (error) Bert.alert(T9n.get(`error.accounts.${error.message}`), 'danger');
|
|
// Bert.alert(error.message, 'danger');
|
|
},
|
|
};
|
|
|
|
OAuthLoginButton.propTypes = {
|
|
service: PropTypes.string.isRequired,
|
|
callback: PropTypes.func,
|
|
};
|
|
|
|
export default translate([], { wait: true })(OAuthLoginButton);
|