/**
 * @file
 * Gateway visual type warning for the node type form.
 *
 * Shows a warning when a gateway node type enables visual types other than
 * "gateway", which may not render branches correctly.
 *
 * @param {object} Drupal The Drupal API namespace.
 */

((Drupal) => {
  Drupal.behaviors.flowdropGatewayVisualType = {
    attach(context) {
      const warning = document.querySelector(
        '[data-fd-gateway-visual-warning]',
      );
      if (!warning) {
        return;
      }

      const groups = context.querySelectorAll(
        '.fd-gateway-visual-types:not([data-fd-gateway-init])',
      );

      groups.forEach((group) => {
        group.setAttribute('data-fd-gateway-init', 'true');

        const update = () => {
          const checked = group.querySelectorAll(
            'input[type="checkbox"]:checked',
          );
          const hasNonGateway = Array.from(checked).some(
            (input) => input.value !== 'gateway',
          );
          warning.hidden = !hasNonGateway;
        };

        group.addEventListener('change', update);
        // Reflect the initial state (e.g. when editing an existing node type).
        update();
      });
    },
  };
})(Drupal);
