EWPP-2069: External link icon for patterns rendering links.

modules/oe_theme_helper/config/install/oe_theme_helper.internal_domains.yml

@@ -0,0 +1 @@
+internal_domain: ''

modules/oe_theme_helper/config/schema/oe_theme_helper.schema.yml

@@ -111,3 +111,10 @@ condition.plugin.oe_theme_helper_current_component_library:
   mapping:
     component_library:
       type: string
+
+oe_theme_helper.internal_domains:
+  type: config_object
+  mapping:
+    internal_domain:
+      type: string
+      label: 'Regular expression to identify internal domains.'

modules/oe_theme_helper/oe_theme_helper.services.yml

@@ -28,7 +28,7 @@ services:
     parent: default_plugin_manager
   oe_theme_helper.twig_extension.twig_extension:
     class: Drupal\oe_theme_helper\TwigExtension\TwigExtension
-    arguments: ['@language_manager', '@renderer']
+    arguments: ['@language_manager', '@renderer', '@oe_theme_helper.external_links']
     tags:
     - { name: twig.extension }
   oe_theme_helper.node_metadata_event_subscriber:
@@ -40,3 +40,6 @@ services:
     class: Drupal\oe_theme_helper\MediaDataExtractorPluginManager
     parent: default_plugin_manager
     arguments: ['@entity_type.bundle.info']
+  oe_theme_helper.external_links:
+    class: Drupal\oe_theme_helper\ExternalLinks
+    arguments: ['@config.factory']

modules/oe_theme_helper/src/ExternalLinks.php

@@ -0,0 +1,57 @@
+<?php
+
+declare(strict_types = 1);
+
+namespace Drupal\oe_theme_helper;
+
+use Drupal\Component\Utility\UrlHelper;
+use Drupal\Core\Config\ConfigFactoryInterface;
+use Drupal\Core\Url;
+
+/**
+ * Verifies if a URL is considered external or internal.
+ */
+class ExternalLinks implements ExternalLinksInterface {
+
+  /**
+   * The configuration factory.
+   *
+   * @var \Drupal\Core\Config\ConfigFactoryInterface
+   */
+  protected $configFactory;
+
+  /**
+   * Constructs an ExternalLinks object.
+   *
+   * @param \Drupal\Core\Config\ConfigFactoryInterface $config_factory
+   *   The configuration factory.
+   */
+  public function __construct(ConfigFactoryInterface $config_factory) {
+    $this->configFactory = $config_factory;
+  }
+
+  /**
+   * {@inheritdoc}
+   */
+  public function isExternalLink($url): bool {
+    if ($url instanceof Url) {
+      $external = $url->isExternal();
+      $path = UrlHelper::parse($url->toString())['path'];
+    }
+    else {
+      $external = UrlHelper::isExternal($url);
+      $path = UrlHelper::parse($url)['path'];
+    }
+    if (!$external) {
+      return $external;
+    }
+
+    // If it's an external link, make sure its domain is not internal.
+    $internal_domain_expression = $this->configFactory->get('oe_theme_helper.internal_domains')->get('internal_domain');
+    if (!$internal_domain_expression) {
+      return $external;
+    }
+    return !preg_match_all($internal_domain_expression, $path);
+  }
+
+}

modules/oe_theme_helper/src/ExternalLinksInterface.php

@@ -0,0 +1,25 @@
+<?php
+
+declare(strict_types = 1);
+
+namespace Drupal\oe_theme_helper;
+
+use Drupal\Core\Url;
+
+/**
+ * Interface for the external links service.
+ */
+interface ExternalLinksInterface {
+
+  /**
+   * Checks whether a link is considered external.
+   *
+   * @param \Drupal\Core\Url|string $url
+   *   The url object.
+   *
+   * @return bool
+   *   TRUE if the link is external, FALSE otherwise.
+   */
+  public function isExternalLink(Url $url): bool;
+
+}

modules/oe_theme_helper/src/TwigExtension/TwigExtension.php

@@ -16,6 +16,7 @@
 use Drupal\Core\Render\RendererInterface;
 use Drupal\Core\Template\Attribute;
 use Drupal\oe_theme_helper\EuropeanUnionLanguages;
+use Drupal\oe_theme_helper\ExternalLinksInterface;
 use Drupal\smart_trim\Truncate\TruncateHTML;
 use Drupal\Core\Template\TwigExtension as CoreTwigExtension;
 use Twig\Environment;
@@ -45,17 +46,27 @@ class TwigExtension extends AbstractExtension {
    */
   protected $renderer;
 
+  /**
+   * The external links service.
+   *
+   * @var \Drupal\oe_theme_helper\ExternalLinksInterface
+   */
+  protected $externalLinks;
+
   /**
    * Constructs a new TwigExtension object.
    *
    * @param \Drupal\Core\Language\LanguageManagerInterface $languageManager
    *   The language manager.
    * @param \Drupal\Core\Render\RendererInterface $renderer
    *   The renderer service.
+   * @param \Drupal\oe_theme_helper\ExternalLinksInterface $external_links
+   *   The external links service.
    */
-  public function __construct(LanguageManagerInterface $languageManager, RendererInterface $renderer) {
+  public function __construct(LanguageManagerInterface $languageManager, RendererInterface $renderer, ExternalLinksInterface $external_links) {
     $this->languageManager = $languageManager;
     $this->renderer = $renderer;
+    $this->externalLinks = $external_links;
   }
 
   /**
@@ -535,7 +546,7 @@ public function getLinkIcon(array $context, string $path, string $size = 's'): a
       'size' => $size,
       'color' => 'primary',
     ];
-    if (UrlHelper::isExternal($path)) {
+    if ($this->externalLinks->isExternalLink($path)) {
       $icon['name'] = 'external';
     }
     else {

modules/oe_theme_helper/tests/src/Unit/TwigExtensionTest.php

@@ -9,6 +9,7 @@
 use Drupal\Core\Language\LanguageManagerInterface;
 use Drupal\Core\Render\Renderer;
 use Drupal\Core\Template\Loader\StringLoader;
+use Drupal\oe_theme_helper\ExternalLinksInterface;
 use Drupal\oe_theme_helper\TwigExtension\TwigExtension;
 use Drupal\oe_theme_helper\EuropeanUnionLanguages;
 use Drupal\Tests\UnitTestCase;
@@ -54,6 +55,13 @@ class TwigExtensionTest extends UnitTestCase {
    */
   protected $twig;
 
+  /**
+   * The external links service.
+   *
+   * @var \Drupal\oe_theme_helper\ExternalLinksInterface
+   */
+  protected $externalLinks;
+
   /**
    * {@inheritdoc}
    */
@@ -79,8 +87,11 @@ protected function setUp(): void {
     // Create Renderer service mock.
     $this->renderer = $this->prophesize(Renderer::class);
 
+    // Create the external link service mock.
+    $this->externalLinks = $this->prophesize(ExternalLinksInterface::class);
+
     // Instantiate the system under test.
-    $this->extension = new TwigExtension($this->languageManager->reveal(), $this->renderer->reveal());
+    $this->extension = new TwigExtension($this->languageManager->reveal(), $this->renderer->reveal(), $this->externalLinks->reveal());
 
     // For convenience, make a version of the Twig environment available that
     // has the tested extension preloaded.

oe_theme.theme

@@ -128,6 +128,7 @@ function oe_theme_preprocess_menu__main(array &$variables): void {
       'label' => $item['title'],
       'href' => $item['url'],
       'is_current' => $item['in_active_trail'],
+      'external' => \Drupal::service('oe_theme_helper.external_links')->isExternalLink($item['url']),
     ];
   }, $variables['items']);
 
@@ -137,6 +138,7 @@ function oe_theme_preprocess_menu__main(array &$variables): void {
         'label' => $item['title'],
         'href' => $item['url'],
         'is_current' => $item['in_active_trail'],
+        'external' => \Drupal::service('oe_theme_helper.external_links')->isExternalLink($item['url']),
       ];
     }, $variables['items'][$name]['below']);
   }
@@ -211,11 +213,14 @@ function oe_theme_theme_suggestions_paragraph_alter(array &$suggestions, array $
  * Implements hook_preprocess_paragraph().
  */
 function oe_theme_preprocess_paragraph__oe_links_block(array &$variables): void {
+  $external_links_service = \Drupal::service('oe_theme_helper.external_links');
   // Massage data to be compliant with ECL links block component data structure.
   foreach (Element::children($variables['content']['field_oe_links']) as $index) {
+    $url = $variables['content']['field_oe_links'][$index]['#url'];
     $variables['links'][] = [
       'label' => $variables['content']['field_oe_links'][$index]['#title'],
-      'url' => $variables['content']['field_oe_links'][$index]['#url'],
+      'url' => $url,
+      'is_external' => $external_links_service->isExternalLink($url),
     ];
   }
 }
@@ -251,10 +256,13 @@ function oe_theme_preprocess_paragraph__oe_contextual_navigation(array &$variabl
   $variables['more_label'] = $paragraph->get('field_oe_text')->value;
 
   $variables['items'] = [];
+  $external_links_service = \Drupal::service('oe_theme_helper.external_links');
   foreach (Element::children($variables['content']['field_oe_links']) as $index) {
+    $url = $variables['content']['field_oe_links'][$index]['#url'];
     $variables['items'][] = [
       'label' => $variables['content']['field_oe_links'][$index]['#title'],
-      'href' => $variables['content']['field_oe_links'][$index]['#url'],
+      'href' => $url,
+      'is_external' => $external_links_service->isExternalLink($url),
     ];
   }
 }
@@ -804,7 +812,9 @@ function oe_theme_preprocess_paragraph__oe_list_item(array &$variables): void {
 
   $list_item_variant = $paragraph->get('oe_paragraphs_variant')->first()->value;
   $variables['variant'] = $list_item_variant ?? 'default';
-  $variables['url'] = $paragraph->get('field_oe_link')->first()->getUrl();
+  $url = $paragraph->get('field_oe_link')->first()->getUrl();
+  $variables['url'] = $url;
+  $variables['external_link'] = \Drupal::service('oe_theme_helper.external_links')->isExternalLink($url);
 
   $cacheability = CacheableMetadata::createFromRenderArray($variables);
 
@@ -867,8 +877,10 @@ function oe_theme_preprocess_paragraph__oe_list_item_block(array &$variables): v
 
   /** @var \Drupal\link\Plugin\Field\FieldType\LinkItem $link_item */
   $link_item = $paragraph->get('field_oe_link')->first();
-  $variables['button_url'] = $link_item->getUrl();
+  $url = $link_item->getUrl();
+  $variables['button_url'] = $url;
   $variables['button_label'] = $link_item->get('title')->getValue();
+  $variables['external_link'] = \Drupal::service('oe_theme_helper.external_links')->isExternalLink($url);
 }
 
 /**
@@ -1414,12 +1426,19 @@ function oe_theme_preprocess_pattern_link(array &$variables): void {
 
   // Extract attributes from the URL object and set them as default.
   if ($variables['url'] instanceof Url) {
+    $variables['external_link'] = \Drupal::service('oe_theme_helper.external_links')->isExternalLink($variables['url']);
     $attributes = (array) $variables['url']->getOption('attributes');
+    if (isset($attributes['class'])) {
+      $variables['classes'] = implode(' ', $attributes['class']);
+      unset($attributes['class']);
+    }
+    foreach ($attributes as $name => $value) {
+      $variables['extra_attributes'][] = [
+        'name' => $name,
+        'value' => $value,
+      ];
+    }
   }
-
-  // Add ECL link classes to attributes.
-  $variables['attributes'] = new Attribute($attributes);
-  $variables['attributes']->addClass('ecl-link', 'ecl-link--' . $variables['variant']);
 }
 
 /**
@@ -1448,8 +1467,10 @@ function oe_theme_preprocess_paragraph__oe_facts_figures(array &$variables): voi
     $variables['title'] = $paragraph->get('field_oe_title')->value;
   }
   if (!$paragraph->get('field_oe_link')->isEmpty()) {
+    $url = $paragraph->get('field_oe_link')->first()->getUrl();
     $variables['view_all']['path'] = $paragraph->get('field_oe_link')->first()->getUrl();
     $variables['view_all']['label'] = $paragraph->get('field_oe_link')->first()->get('title')->getValue();
+    $variables['external_link'] = \Drupal::service('oe_theme_helper.external_links')->isExternalLink($url);
   }
   $variables['items'] = [];
 
@@ -1494,9 +1515,10 @@ function oe_theme_preprocess_paragraph__oe_banner(array &$variables): void {
 
   if (!$paragraph->get('field_oe_link')->isEmpty()) {
     $link = $paragraph->get('field_oe_link')->first();
-    $variables['url'] = $link->getUrl();
+    $url = $link->getUrl();
+    $variables['url'] = $url;
     $variables['label'] = $link->get('title')->getValue();
-    ;
+    $variables['external_link'] = \Drupal::service('oe_theme_helper.external_links')->isExternalLink($url);
   }
 
   $variables['full_width'] = (bool) $paragraph->get('field_oe_banner_full_width')->value;

templates/compositions/ec-component-contextual-navigation/contextual-navigation.html.twig

@@ -60,7 +60,9 @@
           {% include '@ecl-twig/link' with item|merge({
             extra_classes: 'ecl-contextual-navigation__link',
             link: item|merge({
-              type: 'standalone'
+              type: 'standalone',
+              external: item.is_external,
+              icon_path: ecl_icon_path,
             }),
           }) only %}
         </li>

templates/compositions/ec-component-navigation-list/navigation-list.html.twig

@@ -21,7 +21,9 @@
         'link': {
           'type': 'standalone',
           'label': title,
-          'path': title_url
+          'path': title_url,
+          'external': external_link,
+          'icon_path': icon_path
         }
       } only %}
     {% else %}
@@ -38,7 +40,11 @@
       {% for link in links %}
         <li class="ecl-unordered-list__item">
           {% if link.link.path %}
-            {% include '@ecl-twig/link' with { link: link.link|merge({type: 'standalone'}) } only %}
+            {% include '@ecl-twig/link' with { link: link.link|merge({
+              'type': 'standalone',
+              'external': link.link.is_external,
+              'icon_path': icon_path
+            }) } only %}
           {% else %}
             {{ link.link.label }}
           {% endif %}
@@ -51,7 +57,15 @@
       <ul class="ecl-u-mt-m ecl-unordered-list ecl-unordered-list--no-bullet">
         {% for link in secondary_links %}
           <li class="ecl-unordered-list__item">
-            {% include '@ecl-twig/link' with { link: link.link|merge({type: 'standalone'}) } only %}
+            {% if link.link.path %}
+              {% include '@ecl-twig/link' with { link: link.link|merge({
+                'type': 'standalone',
+                'external': link.link.is_external,
+                'icon_path': icon_path
+              }) } only %}
+            {% else %}
+              {{ link.link.label }}
+            {% endif %}
           </li>
         {% endfor %}
       </ul>

templates/paragraphs/paragraph--oe-banner.html.twig

@@ -15,4 +15,5 @@
     'image': image,
     'alignment': alignment,
     'full_width': full_width,
+    'external_link': external_link|default(false)
   }) }}

templates/paragraphs/paragraph--oe-facts-figures.html.twig

@@ -13,5 +13,6 @@
 {% endif %}
 {{ pattern('facts_figures', {
   'items': items,
-  'view_all': view_all
+  'view_all': view_all,
+  'external_link': external_link
 }) }}

templates/paragraphs/paragraph--oe-list-item-block.html.twig

@@ -10,5 +10,6 @@
   'title': content.field_oe_title,
   'items': items,
   'button_url': button_url,
-  'button_label': button_label
+  'button_label': button_label,
+  'external_link': external_link|default(false)
 }) }}

templates/paragraphs/paragraph--oe-list-item.html.twig

@@ -14,5 +14,6 @@
   'meta': meta,
   'date': date,
   'image': image,
-  'secondary_image': image
+  'secondary_image': image,
+  'external_link': external_link|default(false)
 }) }}