import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/taggedTemplateLiteralLoose";
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";

var _templateObject, _templateObject2;

import React, { useState } from 'react';
import GoogleLogin from 'react-google-login';
import FacebookLogin from 'react-facebook-login';
import styled from 'styled-components';
import { Button, IconFacebookLogin, IconGoogleLogin } from '../../Common';
import { useLoginFacebook, useLoginGoogle, useConfigState, useGlobalLabels, useReleva } from '@sentecacommerce-theme/lib';
export var SocialLogin = () => {
  var {
    changeBasket
  } = useReleva();
  var {
    buttons
  } = useGlobalLabels();
  var [showFacebookLogin, setShowFacebookLogin] = useState(false);
  var [showGoogleLogin, setShowGoogleLogin] = useState(false);
  var [facebookLogin] = useLoginFacebook();
  var [googleLogin] = useLoginGoogle();

  var facebookLoginCallback = /*#__PURE__*/function () {
    var _ref = _asyncToGenerator(function* (response) {
      setShowFacebookLogin(false);
      if (response.state === 'unknown') return;
      /* eslint-disable */

      yield facebookLogin({
        access_token: response.tokenId
      });
      /* eslint-enable */

      changeBasket();
    });

    return function facebookLoginCallback(_x) {
      return _ref.apply(this, arguments);
    };
  }();

  var googleLoginCallback = /*#__PURE__*/function () {
    var _ref2 = _asyncToGenerator(function* (response) {
      /* eslint-disable */
      yield googleLogin({
        access_token: response.tokenId
      });
      /* eslint-enable */

      changeBasket();
    });

    return function googleLoginCallback(_x2) {
      return _ref2.apply(this, arguments);
    };
  }();

  var {
    facebook,
    google
  } = useConfigState();
  return /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(SocialButtonWrap, null, /*#__PURE__*/React.createElement(Button, {
    bordered: true,
    fullWidth: true,
    type: "button",
    icon: /*#__PURE__*/React.createElement(IconFacebookLogin, null),
    iconPosition: "left",
    onClick: () => setShowFacebookLogin(true)
  }, buttons.facebookLogin), showFacebookLogin && /*#__PURE__*/React.createElement("div", {
    className: "d-none"
  }, /*#__PURE__*/React.createElement(FacebookLogin, {
    appId: (facebook == null ? void 0 : facebook.appId) || '',
    fields: "name,email",
    callback: facebookLoginCallback,
    autoLoad: true,
    version: "9.0"
  }))), /*#__PURE__*/React.createElement(SocialButtonWrap, null, /*#__PURE__*/React.createElement(Button, {
    bordered: true,
    fullWidth: true,
    type: "button",
    icon: /*#__PURE__*/React.createElement(IconGoogleLogin, null),
    iconPosition: "left",
    onClick: () => setShowGoogleLogin(true)
  }, buttons.googleLogin), showGoogleLogin && /*#__PURE__*/React.createElement("div", {
    className: "d-none"
  }, /*#__PURE__*/React.createElement(GoogleLogin, {
    clientId: (google == null ? void 0 : google.id) || '',
    autoLoad: true,
    onSuccess: googleLoginCallback,
    cookiePolicy: 'single_host_origin'
  }))));
};
var Wrapper = styled.div.attrs({
  className: 'd-flex flex-column justify-content-center'
})(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  width: 100%;\n"])));
var SocialButtonWrap = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n  &:not(:last-child) {\n    margin-bottom: 1rem;\n  }\n"])));
//# sourceMappingURL=index.js.map