Drupal → AJAX добавление товара в корзину в Commerce 2

use Drupal\Core\Ajax\AjaxResponse;
use Drupal\Core\Ajax\OpenModalDialogCommand;
use Drupal\Core\Form\FormStateInterface;
use Drupal\Core\Messenger\MessengerInterface;

/**
 * Implements hook_form_BASE_FORM_ID_alter(): commerce_order_item_add_to_cart_form.
 * Alter "Add to cart" form.
 */
function MODULENAME_form_commerce_order_item_add_to_cart_form_alter(array &$form, FormStateInterface $form_state): void {
  $product = $form_state->get('product'); /** @var ProductInterface $product */

  $form['actions']['submit']['#id'] = 'add-to-cart-button-' . $product->id();
  $form['actions']['submit']['#ajax'] = [
    'callback' => 'MODULENAME_add_to_cart_ajax',
    'event' => 'click',
    'selector' => ':input[data-drupal-selector="add-to-cart-button-' . $product->id() . '"]',
  ];

  $form['#attached']['library'][] = 'core/drupal.dialog.ajax';
}

/**
 * "Add to cart" form ajax submit.
 */
function MODULENAME_add_to_cart_ajax(array &$form, FormStateInterface $form_state): AjaxResponse {
  // Delete status messages
  \Drupal::messenger()->deleteByType(MessengerInterface::TYPE_STATUS);

  // Show dialog
  $response = new AjaxResponse();
  $response->addCommand(new OpenModalDialogCommand('', t('Product added to cart.')));

  return $response;
}

Замечание 1 - кнопкам принудительно задаётся атрибут #id, чтобы они не конфликтовали с другими формами на странице и чтобы сгенерировать нужный html атрибут data-drupal-selector.

Замечание 2 - в #ajax указывается параметр selector, чтобы кнопки нормально работали если товар выводится на странице дважды.