Merge branch 'main' of https://github.com/City-of-Helsinki/drupal-hdb…

…t-admin into renovate/stylelint-16.x

.github/workflows/npm-audit.yml

@@ -0,0 +1,65 @@
+name: Npm audit
+
+on:
+  workflow_dispatch:
+  schedule:
+    - cron: '0 12 * * 0'  # Run every fortnight on Sunday at 12
+
+jobs:
+  npm_audit:
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Run npm audit
+        id: npm_audit
+        run: |
+          node_version=$(cat .nvmrc)
+          echo "Using Node.js version $node_version"
+          export NVM_DIR="$HOME/.nvm" && [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"
+          nvm install $node_version
+          nvm use $node_version
+          npm install --silent
+          set +e
+          npm audit --package-lock-only --loglevel=error;
+          # The npm audit command will exit with a 0 exit code if no vulnerabilities were found.
+          if [ $? -gt 0 ]; then
+            npm audit fix --package-lock-only --loglevel=error;
+            if [ $? -gt 0 ]; then
+              echo "BC_BREAK=:exclamation: NPM Audit fix could not fix all vulnerabilities. Fix them manually by running \`npm audit fix --force\` and test the functionalities thoroughly as there might be breaking changes. :exclamation:" >> $GITHUB_ENV;
+            fi;
+            echo "CREATE_PR=true" >> $GITHUB_OUTPUT;
+          fi;
+          set -e
+
+      - name: Create Pull Request
+        if: steps.npm_audit.outputs.CREATE_PR == 'true'
+        uses: peter-evans/create-pull-request@v4
+        with:
+          committer: GitHub <[email protected]>
+          author: actions-bot <[email protected]>
+          commit-message: Updated node modules based on npm audit fix
+          title: Automatic npm audit fix
+          labels: auto-update
+          body: |
+            # Npm audit
+
+            ${{ env.BC_BREAK }}
+
+            ## How to install
+
+            * Update the HDBT theme
+               * `git fetch --all`
+               * `git checkout automation/npm-audit`
+               * `git pull origin automation/npm-audit`
+            * In theme folder, run `nvm use && npm i && npm run build`
+
+            ## How to test
+            Run `npm audit`
+
+            * [ ] Check that the `npm audit` prints `found 0 vulnerabilities`
+            * [ ] Check that the changes for distributed files are sensible
+
+          branch: automation/npm-audit

.nvmrc

@@ -1 +1 @@
-20.10.0
+20.11.0

.stylelintrc.yaml

@@ -5,12 +5,13 @@ plugins:
 rules:
   # scss/at-import-no-partial-leading-underscore: null
   string-quotes: single # We use single quotes in SCSS
-  declaration-block-no-redundant-longhand-properties: null # We prefer lonhand properties for clarity in SCSS
-  selector-class-pattern: null # We're not too stict about selector class pattern
-  max-line-length: null # Lets not limit line length at this point
+  declaration-block-no-redundant-longhand-properties: null # We prefer longhand properties for clarity in SCSS
+  selector-class-pattern: null # We're not too strict about selector class pattern
+  max-line-length: null # Let's not limit line length at this point
   declaration-empty-line-before: never # No need for empty line before declaration
   order/properties-alphabetical-order: true # We're following alphabetical order in properties
   custom-property-pattern: "^([a-z][a-z0-9]*)(--?[a-z0-9]+)*$" # kebab-case pattern with allowed bem-like double --
+  max-nesting-depth: 4 # We're not using normal nesting rule of 3, as admin theme is all about overriding styles
 overrides:
   - files:
       - '**/ckeditor.scss'

composer.json

@@ -10,6 +10,6 @@
         "drupal/admin_toolbar": "^3.0"
     },
     "conflict": {
-        "drupal/helfi_platform_config": "<4.0"
+        "drupal/helfi_platform_config": "<4.3"
     }
 }

hdbt_admin.libraries.yml

@@ -1,3 +1,11 @@
+character-counter:
+  js:
+    dist/js/characterCounter.min.js: {}
+  version: 1.0.0
+  dependencies:
+    - core/drupal
+    - core/once
+
 language-switcher:
   js:
     dist/js/languageSwitcher.min.js: {}

hdbt_admin.theme

@@ -8,6 +8,7 @@
 use Drupal\Core\Entity\EntityFormInterface;
 use Drupal\Core\Form\FormStateInterface;
 use Drupal\Core\Language\LanguageInterface;
+use Drupal\Core\StringTranslation\TranslatableMarkup;
 use Drupal\media\MediaInterface;
 
 /**
@@ -83,6 +84,12 @@ function _hdbt_admin_form_template_suggestions(array &$suggestions, array &$vari
   if (in_array('koro', $variables['element']['#parents'], TRUE)) {
     $suggestions[] = $variables['theme_hook_original'] . '__koro';
   }
+  if (
+    in_array('field_hero_title', $variables['element']['#parents'], TRUE) ||
+    in_array('field_hero_desc', $variables['element']['#parents'], TRUE)
+  ) {
+    $suggestions[] = $variables['theme_hook_original'] . '__character_count';
+  }
 }
 
 /**
@@ -414,3 +421,68 @@ function hdbt_admin_preprocess_media(&$variables) {
 function hdbt_admin_preprocess_page(&$variables) {
   $variables['#attached']['drupalSettings']['eu_cookie_compliance']['hide_the_banner'] = TRUE;
 }
+
+/**
+ * Implements hook_preprocess_field_multiple_value_form().
+ */
+function hdbt_admin_preprocess_field_multiple_value_form(&$variables) {
+  if (!isset($variables['table']['#header'])) {
+    return;
+  }
+
+  // Theme.inc introduced a new variable in $variables['table']['#header']
+  // that will print out the Sort order column. To keep the UI clean, let's
+  // add visually-hidden class to remove that unnecessary information.
+  // See. theme.inc: template_preprocess_field_multiple_value_form().
+  foreach ($variables['table']['#header'] as $td => $value) {
+    if (
+      $value instanceof TranslatableMarkup &&
+      $value->getUntranslatedString() === 'Order' &&
+      isset($value->getOptions()['context']) &&
+      $value->getOptions()['context'] === 'Sort order'
+    ) {
+      // Add visually hidden class to the Sort order column.
+      $span_element = [
+        'data' => [
+          '#type' => 'html_tag',
+          '#tag' => 'span',
+          '#value' => $value,
+        ],
+        'class' => ['visually-hidden'],
+      ];
+
+      $variables['table']['#header'][$td] = $span_element;
+    }
+  }
+}
+
+/**
+ * Implements hook_preprocess_HOOK().
+ */
+function hdbt_admin_preprocess_form_element(array &$variables) {
+  // Map the counter input tag, step value and total value to variables.
+  $counter_elements = [
+    'field_hero_title' => [
+      'counter_input_tag' => 'input',
+      'counter_step' => 0,
+      'counter_total' => 55,
+    ],
+    'field_hero_desc' => [
+      'counter_input_tag' => 'textarea',
+      'counter_step' => 160,
+      'counter_total' => 200,
+    ],
+  ];
+
+  // Set the mapped values to corresponding fields.
+  foreach ($counter_elements as $counter_element => $counter_values) {
+    if (
+      array_key_exists('name', $variables) &&
+      str_contains($variables['name'], $counter_element)
+    ) {
+      foreach ($counter_values as $key => $value) {
+        $variables[$key] = $value;
+      }
+    }
+  }
+}