import { LISTENERS } from './../../scripts/html/bodyScript';
import type { UNBookPaymentComponentProps } from './UNBookPaymentComponent';

import { PaymentMessage } from '../../messages/webMessages/paymentsMessage';

export const getBookPaymentParams = (props: UNBookPaymentComponentProps) => {
  const accountIdParam = props.accountId ? `account-id="${props.accountId}"` : '';
  const counterpartyAccountIdParam = props.counterPartyAccountId ? `counterparty-account-id="${props.counterPartyAccountId}"` : '';
  const counterpartyNameParam = props.counterPartyName ? `counterparty-name="${props.counterPartyName}"` : '';
  return `
    ${accountIdParam}
    is-same-customer="${props.isSameCustomer || false}"
    ${counterpartyAccountIdParam}
    ${counterpartyNameParam}
    is-auto-focus="${props.isAutoFocus || false}"
    initial-stage-back-button="${props.initialStageBackButton ?? false}"
    final-stage-done-button="${props.finalStageDoneButton ?? false}"
    style="height: 100%"
  `;
};

export const getBookPaymentScript = () => {
  return `
    window.addEventListener("${PaymentMessage.PAYMENT_CREATED}", (e) => {
      const response = e.detail
        response.then((data) => {
          postMessageToSDK({ type: "${PaymentMessage.PAYMENT_CREATED}", details:  { data: JSON.stringify(data.data) }})
        }).catch((e) => {
          console.log(e)
        })
    });

    ${LISTENERS.requestRefresh}
    ${LISTENERS.unitPaymentInitialStageBackButtonClicked}
    ${LISTENERS.unitPaymentFinalStageDoneButtonClicked}
  `;
};