drafted materio_sapi search block vue integration

web/modules/custom/materio_sapi/materio_sapi.routing.yml

@@ -5,6 +5,14 @@ materio_sapi.search_autocomplete:
     _format: json
   requirements:
     _permission: 'access materio search'
+
+materio_sapi.search_form:
+  path: '/materio_sapi/search_form'
+  defaults:
+    _controller: '\Drupal\materio_sapi\Controller\AjaxSearchForm::getForm'
+    _format: json
+  requirements:
+    _permission: 'access materio search'
 #
 # materio_sapi.materio_sapi_search_form:
 #   path: '/materio_sapi/form/materio_sapi_search'

web/modules/custom/materio_sapi/src/Controller/AjaxSearchForm.php

@@ -0,0 +1,84 @@
+<?php
+// https://www.qed42.com/blog/autocomplete-drupal-8
+// https://www.drupal.org/docs/8/modules/search-api/developer-documentation/executing-a-search-in-code
+
+namespace Drupal\materio_sapi\Controller;
+
+use Drupal\Core\Controller\ControllerBase;
+use Symfony\Component\DependencyInjection\ContainerInterface;
+use Drupal\Core\Form\FormBuilder;
+use Drupal\Core\Form\FormState;
+use Symfony\Component\HttpFoundation\JsonResponse;
+use Symfony\Component\HttpFoundation\Request;
+use Drupal\Core\Cache\CacheableJsonResponse;
+use Drupal\Core\Cache\CacheableMetadata;
+use Drupal\core\render\RenderContext;
+
+
+/**
+ * Defines a route controller for entity autocomplete form elements.
+ */
+class AjaxSearchForm extends ControllerBase {
+
+  /**
+   * The form builder.
+   *
+   * @var \Drupal\Core\Form\FormBuilder
+   */
+  protected $formBuilder;
+
+  /**
+   * Construct.
+   */
+  public function __construct(FormBuilder $formBuilder) {
+    $this->formBuilder = $formBuilder;
+  }
+
+  /**
+   * {@inheritdoc}
+   */
+  public static function create(ContainerInterface $container) {
+    return new static(
+      $container->get('form_builder')
+    );
+  }
+
+  private function getFormDefinition(){
+    $language = \Drupal::languageManager()->getCurrentLanguage()->getId();
+    \Drupal::logger('materio_sapi')->notice($language);
+
+    // $form_state = new FormState();
+    $this->form_builded = $this->formBuilder->getForm('Drupal\materio_sapi\Form\MaterioSapiSearchForm', $language);
+  }
+
+  /**
+   * Handler for getform request.
+   */
+  public function getForm(Request $request) {
+    
+    $this->getFormDefinition();
+
+    $rendered = render($this->form_builded);
+    // $form_builded = $this->form_builded;
+    // $rendered = \Drupal::service('renderer')->executeInRenderContext(new RenderContext(), function () use ($form_builded) {
+    //     return render($form_builded);
+    //   });
+    $data = [
+      'rendered' => $rendered,
+      // '#cache' => [
+      //   'max-age' => \Drupal\Core\Cache\Cache::PERMANENT,
+      //   'tags' => [
+      //     'materio_sapi-search_form-cache',
+      //   ]
+      // ]
+    ];
+
+    $response = new JsonResponse();
+    $response->setData($data);
+    // $response = new CacheableJsonResponse($data);
+    // $response->addCacheableDependency(CacheableMetadata::createFromRenderArray($data));
+
+    return $response;
+  }
+
+}

web/modules/custom/materio_sapi/src/Controller/FormAutocomplete.php

@@ -58,13 +58,8 @@ class FormAutocomplete extends ControllerBase {
       // @see hook_search_api_results_TAG_alter()
       $query->addTag('materio_sapi_autocomplete');
 
-      // Execute the search.
       $results = $query->execute();
 
-      // echo "Result count: {$results->getResultCount()}\n";
-      // $ids = implode(', ', array_keys($results->getResultItems()));
-      // echo "Returned IDs: $ids.\n";
-
       // $items = $results->getResultItems();
       // \Drupal::logger('materio_sapi')->notice($results->getResultCount());
       // \Drupal::logger('materio_sapi')->notice(implode(', ', array_keys($items)));

web/modules/custom/materio_sapi/src/Form/MaterioSapiSearchForm.php

@@ -30,12 +30,19 @@ class MaterioSapiSearchForm extends FormBase {
       '#weight' => '0',
       '#attributes' => [
         "placeholder" => $this->t('Search'),
+        "@keyup" => "keyup",
+        "@keyup.enter" => "submit",
+        "v-model" => "typed"
+
       ],
       '#autocomplete_route_name' => 'materio_sapi.search_autocomplete',
     ];
     $form['submit'] = [
       '#type' => 'submit',
       '#value' => $this->t('Search'),
+      '#attributes' => [
+        '@click.prevent' => "submit",
+      ]
     ];
 
     return $form;