feat(SLB-146): filter preview updates by node id

apps/preview/server/index.ts

@@ -7,6 +7,7 @@ const expressWsInstance = expressWs(expressServer);
 const { app } = expressWsInstance;
 
 const updates$ = new Subject();
+app.use(express.json());
 
 app.get('/endpoint.js', (_, res) => {
   res.send(
@@ -18,7 +19,7 @@ app.get('/endpoint.js', (_, res) => {
 
 // TODO: Protect endpoints and preview with Drupal authentication.
 app.post('/__preview', (req, res) => {
-  updates$.next({ body: req.body });
+  updates$.next(req.body || {});
   res.json(true);
 });
 

packages/drupal/silverback_autosave/silverback_autosave.services.yml

@@ -1,7 +1,12 @@
 services:
   silverback_autosave.entity_form_storage:
     class: \Drupal\silverback_autosave\Storage\AutosaveEntityFormDatabaseStorage
-    arguments: ['@database', '@serialization.phpserialize']
+    arguments: [
+      '@database',
+      '@serialization.phpserialize',
+      '@http_client',
+      '@logger.channel.default',
+    ]
 
   form_validator.silverback_autosave:
     public: false

packages/drupal/silverback_autosave/src/Storage/AutosaveEntityFormDatabaseStorage.php

@@ -9,6 +9,10 @@
 use Drupal\Core\Entity\EntityInterface;
 use Drupal\Core\Form\FormState;
 use Drupal\Core\Form\FormStateInterface;
+use Drupal\Core\Logger\LoggerChannelInterface;
+use GuzzleHttp\ClientInterface;
+use GuzzleHttp\Exception\GuzzleException;
+use GuzzleHttp\RequestOptions;
 
 /**
  * A database backend for autosave of entity forms.
@@ -29,6 +33,16 @@ class AutosaveEntityFormDatabaseStorage implements AutosaveEntityFormStorageInte
    */
   protected $serializer;
 
+  /**
+   * @var \GuzzleHttp\ClientInterface
+   */
+  protected $httpClient;
+
+  /**
+   * @var \Drupal\Core\Logger\LoggerChannelInterface
+   */
+  protected $logger;
+
   /**
    * Constructs an AutosaveEntityStorage.
    *
@@ -37,9 +51,11 @@ class AutosaveEntityFormDatabaseStorage implements AutosaveEntityFormStorageInte
    * @param \Drupal\Component\Serialization\SerializationInterface $serializer
    *   The serializer to use.
    */
-  public function __construct(Connection $connection, SerializationInterface $serializer) {
+  public function __construct(Connection $connection, SerializationInterface $serializer, ClientInterface $httpClient, LoggerChannelInterface $logger) {
     $this->connection = $connection;
     $this->serializer = $serializer;
+    $this->httpClient = $httpClient;
+    $this->logger = $logger;
   }
 
   /**
@@ -84,9 +100,21 @@ public function storeEntityAndFormState($form_id, $form_session_id, $entity_type
           $serialized_form_state,
         ])
         ->execute();
-      // @todo Clean up this prototype.
-      // @todo pass entity information so clients can filter if they have to update.
-      \Drupal::service('http_client')->post((getenv('PREVIEW_URL') ?: 'http://localhost:8001') . '/__preview');
+      try {
+        $this->httpClient->post((getenv('PREVIEW_URL') ?: 'http://localhost:8001') . '/__preview', [
+          RequestOptions::HEADERS => [
+            'Content-Type' => 'application/json',
+          ],
+          RequestOptions::JSON => [
+            'entity_type_id' => $entity_type_id,
+            'entity_id' => $entity_id,
+            'langcode' => $langcode,
+          ],
+        ]);
+      } catch (GuzzleException $exc) {
+        $this->logger->critical('Error while to update preview.');
+        $this->logger->critical($exc->getMessage());
+      }
     }
   }
 

packages/ui/src/components/Routes/Preview.tsx

@@ -18,7 +18,20 @@ function usePreviewParameters(): OperationVariables<
 
 export function usePreviewRefresh() {
   const params = usePreviewParameters();
-  return () => clear(PreviewDrupalPageQuery, params);
+  return (input: {
+    entity_type_id?: string;
+    entity_id?: string;
+    langcode?: string;
+  }) => {
+    if (
+      // TODO: Extend for non-node entities?
+      input.entity_type_id === 'node' &&
+      input.entity_id === params.id &&
+      input.langcode === params.locale
+    ) {
+      clear(PreviewDrupalPageQuery, params);
+    }
+  };
 }
 
 export function Preview() {