/* index.tsx generated by @compiled/babel-plugin v0.39.1 */
import _extends from "@babel/runtime/helpers/extends";
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import "./index.compiled.css";
import { ax, ix } from "@compiled/react/runtime";
import React from 'react';
import { FormattedMessage } from 'react-intl-next';
import LockLockedIcon from '@atlaskit/icon/core/lock-locked';
import { Pressable } from '@atlaskit/primitives/compiled';
import { N500 } from '@atlaskit/theme/colors';
import { messages } from '../../../messages';
import { HoverCard } from '../../HoverCard';
import { ActionButton } from '../common/action-button';
import InlineLozenge from '../common/inline-lozenge';
import { Frame } from '../Frame';
import { IconAndTitleLayout } from '../IconAndTitleLayout';
var styles = {
  actionButtonLozengeStyle: "_2rkolb4i _bfhksm61 _ca0qze3t _u5f3ze3t _n3tdze3t _19bvze3t _p12f1osq"
};
var fallbackForbiddenIcon = function fallbackForbiddenIcon() {
  return /*#__PURE__*/React.createElement(LockLockedIcon, {
    label: "error",
    color: "var(--ds-icon-danger, #C9372C)",
    testId: "forbidden-view-fallback-icon"
  });
};
export var InlineCardForbiddenView = function InlineCardForbiddenView(_ref) {
  var url = _ref.url,
    icon = _ref.icon,
    onClick = _ref.onClick,
    isSelected = _ref.isSelected,
    _ref$testId = _ref.testId,
    testId = _ref$testId === void 0 ? 'inline-card-forbidden-view' : _ref$testId,
    truncateInline = _ref.truncateInline,
    requestAccessContext = _ref.requestAccessContext,
    onAuthorise = _ref.onAuthorise,
    context = _ref.context,
    showHoverPreview = _ref.showHoverPreview;
  var frameRef = React.useRef(null);
  var _React$useState = React.useState(!!(requestAccessContext !== null && requestAccessContext !== void 0 && requestAccessContext.callToActionMessageKey)),
    _React$useState2 = _slicedToArray(_React$useState, 1),
    hasRequestAccessContextMessage = _React$useState2[0];
  var handleRetry = React.useCallback(function (event) {
    event.preventDefault();
    event.stopPropagation();
    if (onAuthorise) {
      onAuthorise();
    } else {
      var _requestAccessContext;
      requestAccessContext === null || requestAccessContext === void 0 || (_requestAccessContext = requestAccessContext.action) === null || _requestAccessContext === void 0 || _requestAccessContext.promise();
    }
  }, [onAuthorise, requestAccessContext === null || requestAccessContext === void 0 ? void 0 : requestAccessContext.action]);
  var renderForbiddenAccessMessage = React.useCallback(function () {
    if (requestAccessContext !== null && requestAccessContext !== void 0 && requestAccessContext.callToActionMessageKey) {
      var callToActionMessageKey = requestAccessContext.callToActionMessageKey;
      return /*#__PURE__*/React.createElement(FormattedMessage, _extends({}, messages[callToActionMessageKey], {
        values: {
          product: context
        }
      }));
    }
    return /*#__PURE__*/React.createElement(FormattedMessage, messages.invalid_permissions, function (formattedMessage) {
      return /*#__PURE__*/React.createElement(React.Fragment, null, formattedMessage);
    });
  }, [context, requestAccessContext]);
  var renderActionButton = React.useCallback(function () {
    var accessType = requestAccessContext === null || requestAccessContext === void 0 ? void 0 : requestAccessContext.accessType;
    if (hasRequestAccessContextMessage) {
      var isDisabled = accessType === 'PENDING_REQUEST_EXISTS';
      return /*#__PURE__*/React.createElement(ActionButton, {
        isDisabled: isDisabled,
        onClick: handleRetry,
        testId: "button-connect-other-account"
      }, renderForbiddenAccessMessage());
    }
    if (onAuthorise) {
      return /*#__PURE__*/React.createElement(Pressable, {
        xcss: styles.actionButtonLozengeStyle,
        onClick: handleRetry,
        style: {
          font: "inherit"
        },
        testId: "button-connect-other-account"
      }, /*#__PURE__*/React.createElement(InlineLozenge, {
        appearance: "moved",
        isBold: true
      }, renderForbiddenAccessMessage()));
    }
    return null;
  }, [handleRetry, hasRequestAccessContextMessage, onAuthorise, renderForbiddenAccessMessage, requestAccessContext === null || requestAccessContext === void 0 ? void 0 : requestAccessContext.accessType]);
  var content = /*#__PURE__*/React.createElement(Frame, {
    testId: testId,
    isSelected: isSelected,
    ref: frameRef,
    truncateInline: truncateInline
  }, /*#__PURE__*/React.createElement(IconAndTitleLayout, {
    icon: icon ? icon : fallbackForbiddenIcon(),
    link: url,
    title: url,
    onClick: onClick,
    titleColor: "var(--ds-text-subtle, ".concat(N500, ")")
  }), renderActionButton());
  if (showHoverPreview) {
    return /*#__PURE__*/React.createElement(HoverCard, {
      url: url
    }, content);
  }
  return content;
};