How to add a cancel button to close an off_canvas form and make it act like the x or escape key

SrpAddFeedbackForm.php

<?php

namespace Drupal\tea_teks_srp\Form;

use Drupal\Core\Entity\EntityInterface;
use Drupal\Core\Form\FormBase;
use Drupal\Core\Form\FormStateInterface;
use Drupal\Core\Ajax\CloseModalDialogCommand;
use Drupal\Core\Ajax\CloseDialogCommand;
use Drupal\Core\Ajax\AjaxResponse;
use Drupal\Core\Ajax\OpenModalDialogCommand;
use Drupal\Core\Ajax\ReplaceCommand;


/**
 * Class SrpAddFeedbackForm.
 */
class SrpAddFeedbackForm extends FormBase {

  /**
   * @var int $instanceId
   *   Used to make sure the getFormId is always unique.
   */
  private static int $instanceId;

  /**
   * {@inheritdoc}
   */
  public function getFormId() {
    //return 'srp_srp_vote_on_citation';
    if (empty(self::$instanceId)) {
      self::$instanceId = 1;
    }
    else {
      self::$instanceId++;
    }
    return 'tea_teks_srp_feedback_add' . self::$instanceId;
  }


  /**
   * {@inheritdoc}
   */
  //public function buildForm(array $form, FormStateInterface $form_state, $citation_nid = NULL, EntityInterface $program = NULL, EntityInterface $correlation = NULL, EntityInterface $expectation = NULL, EntityInterface $citation = NULL) {
  public function buildForm(array $form, FormStateInterface $form_state, EntityInterface $program = NULL, int $feedback_nid = 0, EntityInterface $citation = NULL) {
    $form['#theme'] = 'tea_teks_srp__feedback_add';

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

    $feedback = "";
    $citation_nid = $citation->id();

    $form['isbn'] = [
      '#type' => 'textfield',
      '#title' => $this->t('ISBN'),
      '#default_value' => '',
      '#size' => 60,
      '#maxlength' => 128,
      '#required' => FALSE,
    ];
    $form['page_number'] = [
      '#type' => 'textfield',
      '#title' => $this->t('Page Number'),
      '#default_value' => '',
      '#size' => 10,
      '#maxlength' => 20,
      '#required' => FALSE,
    ];
    $form['url'] = [
      '#type' => 'url',
      '#title' => $this->t('Citation URL'),
      '#default_value' => '',
      '#required' => FALSE,
    ];
    $location_description="";
    $form['location_description'] = [
      '#type' => 'textarea',
      '#title' => $this->t('Specific description of location'),
      '#rows' => 5,
      '#cols' => 50,
      '#resizable' => "both",
      '#value' => $location_description,
      '#attributes' => [
        'id' => "location_description_$citation_nid",
        'name' => 'location-description-' . $citation_nid,
      ],
    ];

    $form['feedback'] = [
      '#type' => 'textarea',
      '#title' => $this->t('Provide feedback'),
      '#rows' => 5,
      '#cols' => 50,
      '#resizable' => "both",
      '#value' => $feedback,
      '#attributes' => [
        'id' => "feedback_$citation_nid",
        'name' => 'feedback-' . $citation_nid,
      ],
    ];

    $form['submit'] = [
      '#type' => 'submit',
      '#value' => $this->t('Record Feedback'),
    ];

    $form['cancel'] = [
      '#type' => 'submit',
      '#value' => $this->t('Cancel'),
      '#attributes' => [
        'class' => ['use-ajax',],
      ],
      '#ajax' => [
        'callback' => [$this, 'closeModalForm'],
        'event' => 'click',
      ],
      //'#submit' => ['::cancel',],
    ];

    return $form;
  }



  /**
   * @return \Drupal\Core\Ajax\AjaxResponse
   */
  public function closeModalForm() {
    $command = new CloseModalDialogCommand();
//    $command = new CloseDialogCommand();
    $response = new AjaxResponse();
    $response->addCommand($command);
    return $response;
  }



  /**
   * {@inheritdoc}
   */
  public function validateForm(array &$form, FormStateInterface $form_state) {
    foreach ($form_state->getValues() as $key => $value) {
      // @TODO: Validate fields.
    }
    parent::validateForm($form, $form_state);
  }

  /**
   * {@inheritdoc}
   */
  public function submitForm(array &$form, FormStateInterface $form_state) {
    // Display result.
    foreach ($form_state->getValues() as $key => $value) {
      \Drupal::messenger()->addMessage($key . ': ' . ($key === 'text_format'?$value['value']:$value));
    }
  }

}

SrpCorrelationVotingController.php

      $citations[$i]['record_feedback_link'] = [
        '#type' => 'link',
        '#title' => t('Record Feedback for this Citation'),
        '#url' => Url::fromRoute('tea_teks_srp.tea_teks_srp_feedback_add', ['program' => $program->id(), 'feedback_nid'=> 0, 'citation' => $citation_nid]),
        '#attributes' => [
          'class' => ['use-ajax'],
          'id' => 'record-feedback' . $citations[$i]['nid'],
          'data-dialog-renderer' => 'off_canvas',
          'data-dialog-type' => 'dialog',
//          'data-dialog-type' => 'modal',
          'data-dialog-options' => Json::encode([ 'width' => '30%',]),
        ],
        '#attached' => [
          'library' => [
            'core/drupal.dialog.ajax',
          ],
        ],
      ];