@krowdy/kds-auth/LoginSinglePage/FacebookButton.js

React components that implement Google's Material Design.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

var _typeof = require("@babel/runtime/helpers/typeof");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _react = _interopRequireWildcard(require("react"));

var _reactFacebookLogin = _interopRequireDefault(require("react-facebook-login"));

var _constants = require("./constants");

var _kdsCore = require("@krowdy/kds-core");

var _utils = require("../utils");

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

var FacebookButton = function FacebookButton() {
  var classes = useStyles();

  var _useAuth = (0, _utils.useAuth)(),
      _useAuth$facebookCred = _useAuth.facebookCredentials;

  _useAuth$facebookCred = _useAuth$facebookCred === void 0 ? {} : _useAuth$facebookCred;
  var clientId = _useAuth$facebookCred.clientId,
      validateSocialNetwork = _useAuth.validateSocialNetwork;

  var _handleSuccess = (0, _react.useCallback)(function (response) {
    if (response && response.accessToken) {
      var tokenId = response.accessToken;
      validateSocialNetwork('facebook', {
        method: _constants.METHODS_SESSION['facebook'],
        tokenId: tokenId
      });
    }
  }, [validateSocialNetwork]);

  return clientId ? /*#__PURE__*/_react["default"].createElement(_reactFacebookLogin["default"], {
    appId: clientId,
    callback: _handleSuccess,
    cssClass: classes.buttonFb,
    fields: "name,email,picture",
    icon: /*#__PURE__*/_react["default"].createElement("img", {
      alt: "facebookSocial",
      className: classes.icon,
      src: _constants.IMAGES_SOCIAL['facebook']
    }),
    textButton: "Ingresa con Facebook"
  }) : null;
};

var useStyles = (0, _kdsCore.makeStyles)(function (_ref) {
  var spacing = _ref.spacing,
      palette = _ref.palette;
  return {
    buttonFb: {
      '&:hover': {
        background: '#4A6BB3'
      },
      background: '#4A6BB3',
      border: 'none',
      borderRadius: spacing(.5),
      color: palette.common.white,
      cursor: 'pointer',
      fontSize: 14,
      height: 40,
      marginTop: spacing(2),
      width: '100%'
    },
    icon: {
      marginRight: spacing(2)
    }
  };
}, {
  name: 'FacebookButton'
});

var _default = _react["default"].memo(FacebookButton);

exports["default"] = _default;