import $ from 'jquery';
import { rstrip } from './lib/utils/common_utils';

function openConfirmDangerModal($form, text) {
  const $input = $('.js-confirm-danger-input');
  $input.val('');

  $('.js-confirm-text').text(text || '');
  $('#modal-confirm-danger').modal('show');

  const confirmTextMatch = $('.js-confirm-danger-match').text();
  const $submit = $('.js-confirm-danger-submit');
  $submit.disable();
  $input.focus();

  $('.js-confirm-danger-input').off('input').on('input', function handleInput() {
    const confirmText = rstrip($(this).val());
    if (confirmText === confirmTextMatch) {
      $submit.enable();
    } else {
      $submit.disable();
    }
  });
  $('.js-confirm-danger-submit').off('click').on('click', () => $form.submit());
}

export default function initConfirmDangerModal() {
  $(document).on('click', '.js-confirm-danger', (e) => {
    e.preventDefault();
    const $btn = $(e.target);
    const $form = $btn.closest('form');
    const text = $btn.data('confirmDangerMessage');
    openConfirmDangerModal($form, text);
  });
}