"use strict";

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

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

var _propTypes = _interopRequireDefault(require("prop-types"));

var _commonMessages = _interopRequireDefault(require("@doodle/common-messages"));

var _Button = _interopRequireDefault(require("../../../../controls/Button/Button"));

var _ButtonLabel = _interopRequireDefault(require("../../../../controls/Button/ButtonLabel"));

var _user = require("../../../../utils/user");

var _translate = require("../../../../utils/translate");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

var DefaultAvatar = function DefaultAvatar(props) {
  return /*#__PURE__*/_react["default"].createElement("svg", props, /*#__PURE__*/_react["default"].createElement("path", {
    d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 3c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3zm0 14.2a7.2 7.2 0 0 1-6-3.22c.03-1.99 4-3.08 6-3.08 1.99 0 5.97 1.09 6 3.08a7.2 7.2 0 0 1-6 3.22z",
    fill: "currentColor"
  }));
};

DefaultAvatar.defaultProps = {
  xmlns: "http://www.w3.org/2000/svg",
  viewBox: "0 0 24 24"
};

var UserArea = function UserArea(_ref) {
  var user = _ref.user,
      onClickLogin = _ref.onClickLogin,
      onClickSignup = _ref.onClickSignup,
      intl = _ref.intl;

  if (user && user.loading) {
    return null;
  }

  var showAvatar = (0, _user.isLoggedIn)(user) && !user.error;

  if (!showAvatar) {
    return /*#__PURE__*/_react["default"].createElement("div", {
      className: "UserArea"
    }, /*#__PURE__*/_react["default"].createElement("div", {
      className: "UserArea-buttonRow"
    }, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
      href: onClickSignup ? null : '/signup',
      onClick: onClickSignup,
      dimension: "compact",
      variant: "whiteWithBorder",
      className: "UserArea-signupButton"
    }, /*#__PURE__*/_react["default"].createElement(_ButtonLabel["default"], null, (0, _translate.translate)(_commonMessages["default"].signup, intl))), /*#__PURE__*/_react["default"].createElement(_Button["default"], {
      href: onClickLogin ? null : '/login',
      onClick: onClickLogin,
      dimension: "compact",
      variant: "whiteWithBorder"
    }, /*#__PURE__*/_react["default"].createElement(_ButtonLabel["default"], null, (0, _translate.translate)(_commonMessages["default"].login, intl)))));
  }

  return /*#__PURE__*/_react["default"].createElement("div", {
    className: "UserArea"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: "UserArea-userRow"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: "UserAvatar-avatar",
    style: {
      backgroundImage: "url(".concat(user.data.avatarSmallUrl, ")")
    }
  }, !user.data.avatarSmallUrl && /*#__PURE__*/_react["default"].createElement(DefaultAvatar, null)), /*#__PURE__*/_react["default"].createElement("div", {
    className: "UserArea-userName"
  }, /*#__PURE__*/_react["default"].createElement("div", {
    className: "display-small"
  }, user.data.name), /*#__PURE__*/_react["default"].createElement("div", {
    className: "tiny--soft"
  }, user.data.email))), user.isEligibleForFreeTrial && /*#__PURE__*/_react["default"].createElement(_Button["default"], {
    href: "/premium/business/info",
    variant: "blue",
    dimension: "compact"
  }, (0, _translate.translate)(_commonMessages["default"].startTrial, intl)));
};

UserArea.propTypes = {
  user: _user.userPropType,

  /** Will override default '/login' href if specified. */
  onClickLogin: _propTypes["default"].func,

  /** Will override default '/signup' href if specified. */
  onClickSignup: _propTypes["default"].func,
  intl: _propTypes["default"].object
};
UserArea.defaultProps = {
  user: null,
  onClickLogin: null,
  onClickSignup: null,
  intl: null
};
var _default = UserArea;
exports["default"] = _default;