Issue #3372092 by srishtiiee, lauriii, larowlan, tim.plunkett, kunal.sachdev, Wim Leers: Allow field_type_categories.yml entries to define asset libraries

core/lib/Drupal/Core/Field/FallbackFieldTypeCategory.php

@@ -10,13 +10,14 @@ class FallbackFieldTypeCategory extends FieldTypeCategory {
   /**
    * {@inheritdoc}
    */
-  public function __construct(array $configuration) {
+  public function __construct(array $configuration, string $plugin_id, array $plugin_definition) {
+    $plugin_id = $configuration['unique_identifier'];
     $plugin_definition = [
       'label' => $configuration['label'] ?? '',
       'description' => $configuration['description'] ?? '',
       'weight' => $configuration['weight'] ?? 0,
-    ];
-    parent::__construct($configuration, $configuration['unique_identifier'], $plugin_definition);
+    ] + $plugin_definition;
+    parent::__construct($configuration, $plugin_id, $plugin_definition);
   }
 
 }

core/lib/Drupal/Core/Field/FieldTypeCategory.php

@@ -33,4 +33,11 @@ class FieldTypeCategory extends PluginBase implements FieldTypeCategoryInterface
     return $this->pluginDefinition['weight'];
   }
 
+  /**
+   * {@inheritdoc}
+   */
+  public function getLibraries(): array {
+    return $this->pluginDefinition['libraries'] ?? [];
+  }
+
 }

core/lib/Drupal/Core/Field/FieldTypeCategoryInterface.php

@@ -33,4 +33,12 @@ interface FieldTypeCategoryInterface {
    */
   public function getWeight(): int;
 
+  /**
+   * Returns asset libraries for the field group.
+   *
+   * @return array
+   *   The asset libraries to attach.
+   */
+  public function getLibraries(): array;
+
 }

core/lib/Drupal/Core/Field/FieldTypeCategoryManager.php

@@ -19,6 +19,8 @@ use Drupal\Core\Plugin\DefaultPluginManager;
  *     label: STRING
  *     description: STRING
  *     weight: INTEGER
+ *     libraries:
+ *       - STRING
  * @endcode
  * For example:
  * @code
@@ -26,6 +28,8 @@ use Drupal\Core\Plugin\DefaultPluginManager;
  *   label: Text
  *   description: Text fields.
  *   weight: 2
+ *   libraries:
+ *     - module_name/library_name
  * @endcode
  *
  * @see \Drupal\Core\Field\FieldTypeCategoryInterface

core/modules/comment/comment.module

@@ -16,6 +16,7 @@ use Drupal\Core\Entity\FieldableEntityInterface;
 use Drupal\comment\Plugin\Field\FieldType\CommentItemInterface;
 use Drupal\Core\Entity\Entity\EntityViewMode;
 use Drupal\Core\Entity\EntityInterface;
+use Drupal\Core\Field\FieldTypeCategoryManagerInterface;
 use Drupal\Core\Form\FormStateInterface;
 use Drupal\Core\Routing\RouteMatchInterface;
 use Drupal\Core\Entity\Display\EntityViewDisplayInterface;
@@ -785,8 +786,12 @@ function comment_entity_view_display_presave(EntityViewDisplayInterface $display
 }
 
 /**
- * Implements hook_preprocess_form_element__new_storage_type().
+ * Implements hook_field_type_category_info_alter().
  */
-function comment_preprocess_form_element__new_storage_type(&$variables) {
-  $variables['#attached']['library'][] = 'comment/drupal.comment-icon';
+function comment_field_type_category_info_alter(&$definitions) {
+  // TRICKY: the `comment` field type belongs in the `general` category, so the
+  // libraries need to be attached using an alter hook.
+  if (array_key_exists(FieldTypeCategoryManagerInterface::FALLBACK_CATEGORY, $definitions)) {
+    $definitions[FieldTypeCategoryManagerInterface::FALLBACK_CATEGORY]['libraries'][] = 'comment/drupal.comment-icon';
+  }
 }

core/modules/datetime_range/datetime_range.module

@@ -5,6 +5,7 @@
  * Field hooks to implement a datetime field that stores a start and end date.
  */
 
+use Drupal\Core\Field\FieldTypeCategoryManagerInterface;
 use Drupal\Core\Url;
 use Drupal\Core\Routing\RouteMatchInterface;
 
@@ -29,8 +30,12 @@ function datetime_range_help($route_name, RouteMatchInterface $route_match) {
 }
 
 /**
- * Implements hook_preprocess_form_element__new_storage_type().
+ * Implements hook_field_type_category_info_alter().
  */
-function datetime_range_preprocess_form_element__new_storage_type(&$variables) {
-  $variables['#attached']['library'][] = 'datetime_range/drupal.datetime_range-icon';
+function datetime_range_field_type_category_info_alter(&$definitions) {
+  // TRICKY: the `datetime_range` field type belongs in the `general` category,
+  // so the libraries need to be attached using an alter hook.
+  if (array_key_exists(FieldTypeCategoryManagerInterface::FALLBACK_CATEGORY, $definitions)) {
+    $definitions[FieldTypeCategoryManagerInterface::FALLBACK_CATEGORY]['libraries'][] = 'datetime_range/drupal.datetime_range-icon';
+  }
 }

core/modules/field/tests/modules/field_plugins_test/field_plugins_test.field_type_categories.yml

@@ -2,3 +2,5 @@ test_category:
   label: 'Test category'
   description: 'This is a test field type category.'
   weight: -10
+  libraries:
+    - field_plugins_test/test_library

core/modules/field/tests/src/Kernel/FieldTypeCategoryDiscoveryTest.php

@@ -29,12 +29,14 @@ class FieldTypeCategoryDiscoveryTest extends KernelTestBase {
       'Test category',
       'This is a test field type category.',
       -10,
+      ['field_plugins_test/test_library'],
     ];
 
     $this->assertSame($expected, [
       (string) $category->getLabel(),
       (string) $category->getDescription(),
       $category->getWeight(),
+      $category->getLibraries(),
     ]);
   }
 

core/modules/field_ui/src/Form/FieldStorageAddForm.php

@@ -157,12 +157,13 @@ class FieldStorageAddForm extends FormBase {
 
     $field_type_options = $unique_definitions = [];
     $grouped_definitions = $this->fieldTypePluginManager->getGroupedDefinitions($this->fieldTypePluginManager->getUiDefinitions(), 'label', 'id');
+    $category_definitions = $this->fieldTypeCategoryManager->getDefinitions();
     // Invoke a hook to get category properties.
     foreach ($grouped_definitions as $category => $field_types) {
       foreach ($field_types as $name => $field_type) {
         $unique_definitions[$category][$name] = ['unique_identifier' => $name] + $field_type;
         if ($this->fieldTypeCategoryManager->hasDefinition($category)) {
-          $category_plugin = $this->fieldTypeCategoryManager->createInstance($category, $unique_definitions[$category][$name]);
+          $category_plugin = $this->fieldTypeCategoryManager->createInstance($category, $unique_definitions[$category][$name], $category_definitions[$category]);
           $field_type_options[$category_plugin->getPluginId()] = ['unique_identifier' => $name] + $field_type;
         }
         else {
@@ -243,6 +244,10 @@ class FieldStorageAddForm extends FormBase {
           '#variant' => 'field-option',
         ],
       ];
+
+      if ($libraries = $category_info->getLibraries()) {
+        $field_type_options_radios[$id]['#attached']['library'] = $libraries;
+      }
     }
     uasort($field_type_options_radios, [SortArray::class, 'sortByWeightProperty']);
     $form['add']['new_storage_type'] = $field_type_options_radios;

core/modules/field_ui/tests/src/Functional/FieldTypeCategoriesIntegrationTest.php

@@ -0,0 +1,60 @@
+<?php
+
+namespace Drupal\Tests\field_ui\Functional;
+
+use Drupal\Tests\BrowserTestBase;
+
+/**
+ * Tests field UI integration with field type categories for loading libraries.
+ *
+ * @group field_ui
+ */
+class FieldTypeCategoriesIntegrationTest extends BrowserTestBase {
+
+  /**
+   * {@inheritdoc}
+   */
+  protected static $modules = [
+    'node',
+    'file',
+    'field_ui',
+    'options',
+    'comment',
+    'link',
+  ];
+
+  /**
+   * {@inheritdoc}
+   */
+  protected $defaultTheme = 'stark';
+
+  /**
+   * {@inheritdoc}
+   */
+  protected function setUp(): void {
+    parent::setUp();
+    // Create a test user.
+    $admin_user = $this->drupalCreateUser(['administer node fields']);
+    $this->drupalLogin($admin_user);
+  }
+
+  /**
+   * Tests if the libraries are loaded on FieldStorageAddForm.
+   */
+  public function testLibrariesLoaded() {
+    $this->drupalGet('admin/structure/types/manage/' . $this->drupalCreateContentType()->id() . '/fields/add-field');
+    $page_content = $this->getSession()->getPage()->getContent();
+    $css_libraries = [
+      'drupal.file-icon',
+      'drupal.text-icon',
+      'drupal.options-icon',
+      'drupal.comment-icon',
+      'drupal.link-icon',
+    ];
+    foreach ($css_libraries as $css_library) {
+      // Check if the library asset is present in the rendered HTML.
+      $this->assertStringContainsString($css_library, $page_content);
+    }
+  }
+
+}

core/modules/file/file.field_type_categories.yml

@@ -2,3 +2,5 @@ file_upload:
   label: 'File upload'
   description: 'Field to upload any type of files.'
   weight: -15
+  libraries:
+    - file/drupal.file-icon

core/modules/file/file.module

@@ -1552,10 +1552,3 @@ function file_field_find_file_reference_column(FieldDefinitionInterface $field)
   }
   return FALSE;
 }
-
-/**
- * Implements hook_preprocess_form_element__new_storage_type().
- */
-function file_preprocess_form_element__new_storage_type(&$variables) {
-  $variables['#attached']['library'][] = 'file/drupal.file-icon';
-}

core/modules/link/link.module

@@ -5,6 +5,7 @@
  * Defines simple link field types.
  */
 
+use Drupal\Core\Field\FieldTypeCategoryManagerInterface;
 use Drupal\Core\Link;
 use Drupal\Core\Url;
 use Drupal\Core\Routing\RouteMatchInterface;
@@ -67,8 +68,12 @@ function template_preprocess_link_formatter_link_separate(&$variables) {
 }
 
 /**
- * Implements hook_preprocess_form_element__new_storage_type().
+ * Implements hook_field_type_category_info_alter().
  */
-function link_preprocess_form_element__new_storage_type(&$variables) {
-  $variables['#attached']['library'][] = 'link/drupal.link-icon';
+function link_field_type_category_info_alter(&$definitions) {
+  // TRICKY: the `link` field type belongs in the `general` category, so the
+  // libraries need to be attached using an alter hook.
+  if (array_key_exists(FieldTypeCategoryManagerInterface::FALLBACK_CATEGORY, $definitions)) {
+    $definitions[FieldTypeCategoryManagerInterface::FALLBACK_CATEGORY]['libraries'][] = 'link/drupal.link-icon';
+  }
 }

core/modules/media/media.module

@@ -534,8 +534,12 @@ function media_views_query_substitutions(ViewExecutable $view) {
 }
 
 /**
- * Implements hook_preprocess_form_element__new_storage_type().
+ * Implements hook_field_type_category_info_alter().
  */
-function media_preprocess_form_element__new_storage_type(&$variables) {
-  $variables['#attached']['library'][] = 'media/drupal.media-icon';
+function media_field_type_category_info_alter(&$definitions) {
+  // TRICKY: the `media` field type belongs in the `general` category, so the
+  // libraries need to be attached using an alter hook.
+  if (array_key_exists(FieldTypeCategoryManagerInterface::FALLBACK_CATEGORY, $definitions)) {
+    $definitions[FieldTypeCategoryManagerInterface::FALLBACK_CATEGORY]['libraries'][] = 'media/drupal.media-icon';
+  }
 }

core/modules/options/options.field_type_categories.yml

@@ -2,3 +2,5 @@ selection_list:
   label: 'Selection list'
   description: 'Field to select from predefined options.'
   weight: -15
+  libraries:
+    - options/drupal.options-icon

core/modules/options/options.module

@@ -155,10 +155,3 @@ function options_form_field_storage_config_edit_form_alter(&$form, FormStateInte
   $form['#attached']['library'][] = 'field_ui/drupal.field_ui';
   $table['#attributes']['class'][] = 'allowed-values-table';
 }
-
-/**
- * Implements hook_preprocess_form_element__new_storage_type().
- */
-function options_preprocess_form_element__new_storage_type(&$variables) {
-  $variables['#attached']['library'][] = 'options/drupal.options-icon';
-}

core/modules/telephone/telephone.module

@@ -5,6 +5,7 @@
  * Defines a simple telephone number field type.
  */
 
+use Drupal\Core\Field\FieldTypeCategoryManagerInterface;
 use Drupal\Core\Url;
 use Drupal\Core\Routing\RouteMatchInterface;
 
@@ -36,8 +37,12 @@ function telephone_field_formatter_info_alter(&$info) {
 }
 
 /**
- * Implements hook_preprocess_form_element__new_storage_type().
+ * Implements hook_field_type_category_info_alter().
  */
-function telephone_preprocess_form_element__new_storage_type(&$variables) {
-  $variables['#attached']['library'][] = 'telephone/drupal.telephone-icon';
+function telephone_field_type_category_info_alter(&$definitions) {
+  // TRICKY: the `telephone` field type belongs in the `general` category, so
+  // the libraries need to be attached using an alter hook.
+  if (array_key_exists(FieldTypeCategoryManagerInterface::FALLBACK_CATEGORY, $definitions)) {
+    $definitions[FieldTypeCategoryManagerInterface::FALLBACK_CATEGORY]['libraries'][] = 'telephone/drupal.telephone-icon';
+  }
 }

core/modules/text/text.field_type_categories.yml

@@ -2,3 +2,5 @@ formatted_text:
   label: 'Formatted text'
   description: 'Text field with markup support and optional editor.'
   weight: -45
+  libraries:
+    - text/drupal.text-icon

core/modules/text/text.module

@@ -164,10 +164,3 @@ function text_summary($text, $format = NULL, $size = NULL) {
 
   return $summary;
 }
-
-/**
- * Implements hook_preprocess_form_element__new_storage_type().
- */
-function text_preprocess_form_element__new_storage_type(&$variables) {
-  $variables['#attached']['library'][] = 'text/drupal.text-icon';
-}