"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

const tslib_1 = require("tslib");

const react_1 = tslib_1.__importDefault(require("react"));

const exotic_1 = require("exotic");

const state_1 = require("@skava/state");

const words_1 = require("@skava/ui/dist/words");

const Icons_1 = require("@skava/ui/dist/components/atoms/Icons");

const ConfirmationCard_1 = require("@skava/ui/dist/components/organisms/ConfirmationCard");

const styled_1 = require("./styled");
/**
 * render payment method type
 */


function defaultRenderTogglePaymentMethod(props) {
  const {
    optionLabel,
    state,
    onPaymentChange,
    onTogglePaymentMethod,
    isSelected,
    cardIdentifier
  } = props;

  const handleClick = args => {
    if (exotic_1.isFunction(onPaymentChange)) {
      onPaymentChange(args);

      if (exotic_1.isFunction(onTogglePaymentMethod)) {
        onTogglePaymentMethod(cardIdentifier);
      }
    }
  };

  return state.isExpanded === false && state.isConfirming === false && react_1.default.createElement(styled_1.PaymentOption, {
    "data-qa": isSelected === true ? 'qa-facet-selected' : 'qa-facet'
  }, react_1.default.createElement(styled_1.StyledMaterialIcon, {
    onClick: handleClick,
    type: isSelected ? 'radio_on' : 'radio_off',
    isSelected: isSelected
  }), react_1.default.createElement(styled_1.OptionLabel, {
    content: optionLabel
  }));
}

exports.defaultRenderTogglePaymentMethod = defaultRenderTogglePaymentMethod;
/**
 * render remove button
 */

function defaultRenderRemoveButton(props) {
  const {
    state,
    onRemovePaymentConfirm,
    onRemovePaymentCancel,
    cardIdentifier
  } = props;

  const handleConfirmation = () => {
    state.handleConfirmCancel();

    if (exotic_1.isFunction(onRemovePaymentConfirm)) {
      onRemovePaymentConfirm(cardIdentifier);
    }
  };

  const handleCancel = event => {
    state.handleConfirmCancel();

    if (exotic_1.isFunction(onRemovePaymentCancel)) {
      onRemovePaymentCancel(event);
    }
  };

  const view = state.isConfirming === true ? react_1.default.createElement(ConfirmationCard_1.ConfirmationCard, {
    onConfirmation: handleConfirmation,
    onCancel: handleCancel
  }) : state.isExpanded === false && react_1.default.createElement(styled_1.RemoveButton, {
    text: words_1.wording.remove,
    breedType: "text",
    onClick: state.handleConfirm
  });
  return view;
}

exports.defaultRenderRemoveButton = defaultRenderRemoveButton;
/**
 * render edit button
 */

function defaultRenderButton(props) {
  const {
    state,
    onPaymentEdit
  } = props;
  const iconType = state.isExpanded ? 'expand_less' : 'expand_more';
  const labelText = state_1.application.isDesktop ? words_1.wording.editInformation : words_1.wording.edit;

  const handleClick = () => {
    state.handleToggle();

    if (exotic_1.isFunction(onPaymentEdit)) {
      onPaymentEdit(state);
    }
  };

  return react_1.default.createElement(styled_1.ToggleButton, {
    text: labelText,
    breedType: 'text-with-icon',
    iconType: iconType,
    iconAlignType: 'suffix',
    onClick: handleClick,
    isConfirming: state.isConfirming
  });
}

exports.defaultRenderButton = defaultRenderButton;
/**
 * render payment balance
 */

function defaultRenderBalance(props) {
  const {
    giftBalanceAmount
  } = props;
  return exotic_1.isSafe(giftBalanceAmount) && react_1.default.createElement(react_1.default.Fragment, null, react_1.default.createElement(styled_1.GiftBalanceLabel, {
    content: words_1.wording.balance
  }), react_1.default.createElement(styled_1.GiftBalanceAmount, {
    content: giftBalanceAmount
  }));
}

exports.defaultRenderBalance = defaultRenderBalance;
/**
 * render payment card title / number
 */

function defaultRenderCardDetail(props) {
  const {
    cardTitle,
    cardExpiry
  } = props;
  return react_1.default.createElement(react_1.default.Fragment, null, react_1.default.createElement(styled_1.CardTitle, {
    content: cardTitle
  }), react_1.default.createElement(styled_1.CardExpiry, {
    content: cardExpiry
  }));
}

exports.defaultRenderCardDetail = defaultRenderCardDetail;
/**
 * local function for getting breed type based on the type of icon
 */

function getIconBreedType(cardType) {
  const getType = {
    visa: 'business-with-background',
    master: 'with-background'
  };
  return getType[cardType];
}
/**
 * render payment card icon
 */


function defaultRenderIcon(props) {
  const {
    cardType
  } = props;
  return react_1.default.createElement(Icons_1.PaymentsCardIcon, {
    "data-qa": 'qa-card-logo',
    type: cardType,
    breed: getIconBreedType(cardType),
    width: '76'
  });
}

exports.defaultRenderIcon = defaultRenderIcon;