refactor(SLB-458): improve expiry state

Author: colorfield

packages/composer/amazeelabs/silverback_preview_link/silverback_preview_link.module

@@ -49,6 +49,7 @@ function silverback_preview_link_theme(array $existing, string $type, string $th
       'template' => 'preview-link',
       'variables' => [
         'title' => NULL,
+        'preview_link_has_expired' => FALSE,
         'preview_url' => NULL,
         'preview_qr_code_url' => NULL,
         'expiry_description' => NULL,

packages/composer/amazeelabs/silverback_preview_link/src/Form/PreviewLinkForm.php

@@ -152,6 +152,7 @@ public function buildForm(array $form, FormStateInterface $form_state, RouteMatc
     $displayQRCode = TRUE;
     $qrCodeUrlString = NULL;
     $actionsDescription = NULL;
+    $previewLinkHasExpired = $remainingSeconds === 0;
 
     if ($isNewToken) {
       $expiryDescription = $this->t('Expires @lifetime after creation.', [
@@ -160,8 +161,8 @@ public function buildForm(array $form, FormStateInterface $form_state, RouteMatc
       $qrCode = (new QRCode)->render($externalPreviewUrlString);
     }
     else {
-      if ($remainingSeconds === 0) {
-        $expiryDescription = $this->t('Live preview link</a> for <em>@entity_label</em> has expired, reset link expiry or generate a new one.', [
+      if ($previewLinkHasExpired) {
+        $expiryDescription = $this->t('⌛ <strong>Live preview link</a> for <em>@entity_label</em> has expired</strong>, reset link expiry or generate a new one.', [
           ':url' => $externalPreviewUrlString,
           '@entity_label' => $host->label(),
         ]);
@@ -186,6 +187,7 @@ public function buildForm(array $form, FormStateInterface $form_state, RouteMatc
       '#theme' => 'preview_link',
       '#title' => $this->t('Preview link'),
       '#weight' => -9999,
+      '#preview_link_has_expired' => $previewLinkHasExpired,
       '#preview_url' => $externalPreviewUrlString,
       '#preview_qr_code_url' => $qrCodeUrlString,
       '#expiry_description' => $expiryDescription,

packages/composer/amazeelabs/silverback_preview_link/templates/preview-link.html.twig

@@ -1,6 +1,6 @@
 <div class="preview-link">
   <h2 class="preview-link__title hidden">{{ title }}</h2>
-  {% if preview_url is not empty %}
+  {% if preview_url is not empty and not preview_link_has_expired %}
     <div class="preview-link__copy js-form-item form-item js-form-type-textfield form-type--textfield">
       <input id="preview-link__copy--text"
              disabled
@@ -16,7 +16,10 @@
       </div>
     </div>
   {% endif %}
-  {% if preview_qr_code_url is not empty %}
+  {% if preview_link_has_expired %}
+    <iframe src="https://giphy.com/embed/CZGcUfnAy3ayJw2eZX" width="480" height="398" style="" frameBorder="0" class="giphy-embed" allowFullScreen></iframe>
+  {% endif %}
+  {% if preview_qr_code_url is not empty and not preview_link_has_expired %}
     <div class="preview-link__qr">
       <p>{{ 'Scan the QR Code to open the preview on another device.' }}</p>
       <div class="preview-link__qr--wrapper" style="display: flex; align-items: center; justify-content: center;">