Apache Solr integration in Search API

/* A sample from main front-end factory in jQuery-in-drupal  */
var factory = {

  getViewArgument: function (data) {
    var currentView;
    if (drupalSettings.views && drupalSettings.views.ajaxViews) {
      $.each(drupalSettings.views.ajaxViews, function (view_id, params) {
        if (data.view_id === params.view_name && data.display_id ===
          params.view_display_id) {
          currentView = params;
        }
      });
    }
    return currentView;
  },

  setViewArgument: function (value, data) {
    if (drupalSettings.views && drupalSettings.views.ajaxViews) {
      $.each(drupalSettings.views.ajaxViews, function (view_id, params) {
        if (data.view_id === params.view_name && data.display_id ===
          params.view_display_id) {
          drupalSettings.views.ajaxViews[view_id].view_args = value;
        }
      });
    }
  },

  processQuery: function (path) {
    var queryString = window.location.search || '';
    if (queryString !== '') {
      queryString = queryString.slice(1).replace(/q=[^&]+&?|&?render=[^&]+/,
        '');
      if (queryString !== '') {
        queryString = (/\?/.test(path) ? '&' : '?') + queryString;
      }
    }
    return queryString;
  },

  isJson: function (input) {
    input = typeof input !== 'string' ? JSON.stringify(input) : input;

    try {
      input = JSON.parse(input);
    } catch (e) {
      console.log(e);
      return false;
    }

    if (typeof input === 'object' && input !== null) {
      return true;
    }
    return false;
  },

  getViewContentHighlight: function (params, highlightClass, hasArgument,
    hasQueryParam) {
    if (params.view && params.view.view_dom_id) {
      var view = $('.js-view-dom-id-' + params.view.view_dom_id);
      view.find('.text-highlight').each(function () {
        var highlightElement = $(this);
        var highlightText = $(this).text() ? $(this).text().toUpperCase() :
          null;
        var argumentValues;
        if (hasArgument) {
          argumentValues = hasArgument.indexOf(' ') > 0 ? hasArgument.toUpperCase()
            .split(' ') : [hasArgument.toUpperCase()];
        } else {
          if (hasQueryParam) {
            argumentValues = hasQueryParam.indexOf(' ') > 0 ?
              hasQueryParam.toUpperCase().split(' ') : [hasQueryParam.toUpperCase()];
          } else {
            argumentValues = ['all'];
          }
        }
        if (highlightElement.length && argumentValues) {
          $.each(argumentValues, function (i, argumentValue) {
            if (highlightText.indexOf(argumentValue) > -1) {
              highlightElement.addClass(highlightClass);
            }
          });
        }
      });
    }
  },

  processViewSubtitle: function (element, parentWrapper, widgetType = 'text',
    existing = {}, titleId = null) {
    if (!titleId) {
      titleId = element.data('title') ? 'diplo-ajax-filter-' + element.data(
        'title').toLowerCase().replace(' ', '_') : null;
    }

    if (titleId) {

      var titleValue;

      if (widgetType === 'select') {
        var option = element.val() ? element.find('option[value="' +
          element.val() + '"]') : null;
        if (option && option.length) {
          titleValue = option.text();
        }
      } else {
        titleValue = element.val();
      }

      if (titleValue && titleValue.length > 41) {
        titleValue = titleValue.replace(/^(.{41}[^\s]*).*/, "$1") + '...';
      }

      if (existing.length) {
        var currentValue = existing.find('.views-subtitle').text();
        if (currentValue !== element.val()) {
          existing.find('.views-subtitle').text(element.val());
        }
      } else {
        var titleHtml;
        if (element.hasClass('diplo-search-input')) {
          titleHtml = '<div id="' + titleId +
            '" class="animate bounceIn col-xs-12 pl-0 pr-0 mb-16">';
          titleHtml += '<div class="pl-0 col-xs-11">';
          titleHtml +=
            '<span class="views-subtitle pl-8 pr-8 bg-highlight-orange text-white border">' +
            titleValue;
          titleHtml += '</span></div></div>';
        } else {
          titleHtml = '<div id="' + titleId +
            '" class="animate bounceIn col-xs-12 pl-0 pr-0 mb-16">';
          titleHtml += '<div class="pl-0 col-xs-11">' + element.data(
            'title');
          titleHtml +=
            ': <span class="views-subtitle pl-8 pr-8 bg-highlight-blue border">' +
            titleValue + '</span></div></div>';
        }
        parentWrapper.append(titleHtml);
      }
    }
  }
};

// Highlight for filters and on search page
Drupal.AjaxCommands.prototype.diploHighlight = function (ajax, response) {
  var params = {
    view: {
      view_dom_id: response.view_dom_id,
    }
  };
  factory.getViewContentHighlight(params, 'orange', response.view_arg[0]);
};

// Append Views filters values to view/listing title
Drupal.AjaxCommands.prototype.diploSubtitles = function (ajax, response) {
  factory.processViewSubtitle($(this), $(response.append_block), 'search',
    response.existing, 'search-term-title-append');
};

<?php

namespace Drupal\diplo_formatters\EventSubscriber;
use Drupal\Core\Ajax\AjaxResponse;
use Drupal\views\Ajax\ViewAjaxResponse;
use Symfony\Component\EventDispatcher\EventSubscriberInterface;
use Symfony\Component\HttpKernel\Event\FilterResponseEvent;
use Symfony\Component\HttpKernel\KernelEvents;

/**
 * Custom EventSubscriber in Drupal/PHP.
 */
class AjaxResponseSubscriber implements EventSubscriberInterface {
  /**
   * Renders the ajax commands right before preparing the result.
   *
   * @param \Symfony\Component\HttpKernel\Event\FilterResponseEvent $event
   *   The response event, which contains the possible AjaxResponse object.
   */
  public function onResponse(FilterResponseEvent $event): void {

    $response = $event->getResponse();

    // Only alter views ajax responses.
    if ($response instanceof ViewAjaxResponse) {
      $commands = &$response->getCommands();
      $view = $response->getView();
      $filters = [];
      if (!empty($view->getExposedInput())) {
        $skip = ['content_identifier', 'single_filter'];
        foreach ($view->getExposedInput() as $key => $value) {
          if (!in_array($key, $skip) && !empty($value) && $value != 'All') {
            $filters[$key] = $value;
          }
        }
      }
      if ($view->display_handler->hasPath()) {
        $commands[] = [
          'command' => 'diploAjaxPager',
          'selector' => '.js-view-dom-id-' . $view->dom_id,
          'view_dom_id' => $view->dom_id,
          'view_arg' => $view->args,
          'view_filters' => $filters,
          'view_pager' => $view->pager->current_page,
          'view_path' => '/' . $view->display_handler->getPath(),
        ];
      }
      $commands[] = [
        'command' => 'diploHighlight',
        'selector' => '.js-view-dom-id-' . $view->dom_id,
        'view_dom_id' =>  $view->dom_id,
        'view_arg' => $view->args
      ];
    }
    else if ($response instanceof AjaxResponse) {
      $commands = &$response->getCommands();
      $commands[] = [
        'command' => 'diploAjax',
      ];
    }
  }

  /**
   * {@inheritdoc}
   */
  public static function getSubscribedEvents(): array {
    return [KernelEvents::RESPONSE => [['onResponse']]];
  }

}