From 49b97fc077fb967d32789e45338169bf415f17f0 Mon Sep 17 00:00:00 2001
From: Sebastian Almberg <83243306+Sebbeben@users.noreply.github.com>
Date: Thu, 12 Mar 2026 09:07:19 +0100
Subject: [PATCH] Fix spinning icon, text visibility, auto-priority, and SPN
 match highlighting

- Replace spinning icon with static icon on Active Jobs header
- Match highlighting now checks source keyword against name, MPN, AND provider ID (SPN)
- Show green "Match" badge in source field column when any field matches 100%
- Auto-increment priority when adding new field mapping rows
- Fix text-muted visibility issues on table-success background
---
 .../controllers/field_mapping_controller.js   | 19 +++++++++++++++++
 .../bulk_import/manage.html.twig              |  2 +-
 .../bulk_import/step2.html.twig               | 21 ++++++++++++++-----
 translations/messages.en.xlf                  | 12 +++++++++++
 4 files changed, 48 insertions(+), 6 deletions(-)

diff --git a/assets/controllers/field_mapping_controller.js b/assets/controllers/field_mapping_controller.js
index 9c9c8ac6..50c19a0d 100644
--- a/assets/controllers/field_mapping_controller.js
+++ b/assets/controllers/field_mapping_controller.js
@@ -70,6 +70,13 @@ export default class extends Controller {
             newFieldSelect.addEventListener('change', this.updateFieldOptions.bind(this))
         }
 
+        // Auto-increment priority based on existing mappings
+        const nextPriority = this.getNextPriority()
+        const priorityInput = newRow.querySelector('input[name*="[priority]"]')
+        if (priorityInput) {
+            priorityInput.value = nextPriority
+        }
+
         this.updateFieldOptions()
         this.updateAddButtonState()
     }
@@ -119,6 +126,18 @@ export default class extends Controller {
         }
     }
 
+    getNextPriority() {
+        const priorityInputs = this.tbodyTarget.querySelectorAll('input[name*="[priority]"]')
+        let maxPriority = 0
+        priorityInputs.forEach(input => {
+            const val = parseInt(input.value, 10)
+            if (!isNaN(val) && val > maxPriority) {
+                maxPriority = val
+            }
+        })
+        return Math.min(maxPriority + 1, 10)
+    }
+
     handleFormSubmit(event) {
         if (this.hasSubmitButtonTarget) {
             this.submitButtonTarget.disabled = true
diff --git a/templates/info_providers/bulk_import/manage.html.twig b/templates/info_providers/bulk_import/manage.html.twig
index fc37c562..e15d6708 100644
--- a/templates/info_providers/bulk_import/manage.html.twig
+++ b/templates/info_providers/bulk_import/manage.html.twig
@@ -32,7 +32,7 @@
             {# Active Jobs #}
             {% if active_jobs is not empty %}
                 <h5 class="mb-3">
-                    <i class="fas fa-spinner fa-pulse me-1"></i> {% trans %}info_providers.bulk_import.active_jobs{% endtrans %}
+                    <i class="fas fa-tasks me-1"></i> {% trans %}info_providers.bulk_import.active_jobs{% endtrans %}
                     <span class="badge bg-primary">{{ active_jobs|length }}</span>
                 </h5>
                 <div class="table-responsive mb-4">
diff --git a/templates/info_providers/bulk_import/step2.html.twig b/templates/info_providers/bulk_import/step2.html.twig
index 9b7a8b5a..350fffdf 100644
--- a/templates/info_providers/bulk_import/step2.html.twig
+++ b/templates/info_providers/bulk_import/step2.html.twig
@@ -220,8 +220,12 @@
                                                  class="hoverpic" style="max-width: 35px;" {{ stimulus_controller('elements/hoverpic') }}>
                                         </td>
                                         <td>
-                                            {% set nameMatch = dto.name is not null and part.name is not null and dto.name|lower == part.name|lower %}
-                                            {% set mpnMatch = dto.mpn is not null and part.manufacturerProductNumber is not null and dto.mpn|lower == part.manufacturerProductNumber|lower %}
+                                            {# Check for matches against source keyword (what was searched) #}
+                                            {% set sourceKw = result.sourceKeyword|default('')|lower %}
+                                            {% set nameMatch = sourceKw is not empty and dto.name is not null and dto.name|lower == sourceKw %}
+                                            {% set mpnMatch = sourceKw is not empty and dto.mpn is not null and dto.mpn|lower == sourceKw %}
+                                            {% set spnMatch = sourceKw is not empty and dto.provider_id is not null and dto.provider_id|lower == sourceKw %}
+                                            {% set anyMatch = nameMatch or mpnMatch or spnMatch %}
                                             {% if dto.provider_url is not null %}
                                                 <a href="{{ dto.provider_url }}" target="_blank" rel="noopener"{% if nameMatch %} class="fw-bold"{% endif %}>{{ dto.name }}</a>
                                             {% else %}
@@ -231,7 +235,7 @@
                                                 <span class="badge bg-success ms-1" title="{% trans %}info_providers.bulk_import.exact_match{% endtrans %}"><i class="fas fa-check-circle"></i></span>
                                             {% endif %}
                                             {% if dto.mpn is not null %}
-                                                <br><small{% if mpnMatch %} class="fw-bold text-success"{% else %} class="text-muted"{% endif %}>{{ dto.mpn }}</small>
+                                                <br><small{% if mpnMatch %} class="fw-bold text-success"{% endif %}>{{ dto.mpn }}</small>
                                                 {% if mpnMatch %}
                                                     <span class="badge bg-success ms-1" style="font-size: 0.65em;" title="{% trans %}info_providers.bulk_import.mpn_match{% endtrans %}">MPN <i class="fas fa-check-circle"></i></span>
                                                 {% endif %}
@@ -241,10 +245,17 @@
                                         <td>{{ dto.manufacturer ?? '' }}</td>
                                         <td>
                                             {{ info_provider_label(dto.provider_key)|default(dto.provider_key) }}
-                                            <br><small class="text-muted">{{ dto.provider_id }}</small>
+                                            <br><small{% if spnMatch %} class="fw-bold text-success"{% endif %}>{{ dto.provider_id }}</small>
+                                            {% if spnMatch %}
+                                                <span class="badge bg-success ms-1" style="font-size: 0.65em;" title="{% trans %}info_providers.bulk_import.spn_match{% endtrans %}">SPN <i class="fas fa-check-circle"></i></span>
+                                            {% endif %}
                                         </td>
                                         <td>
-                                            <span class="badge bg-info">{{ result.sourceField ?? 'unknown' }}</span>
+                                            {% if anyMatch %}
+                                                <span class="badge bg-success">{% trans %}info_providers.bulk_import.match{% endtrans %}</span>
+                                            {% else %}
+                                                <span class="badge bg-info">{{ result.sourceField ?? 'unknown' }}</span>
+                                            {% endif %}
                                             {% if result.sourceKeyword %}
                                                 <br><small>{{ result.sourceKeyword }}</small>
                                             {% endif %}
diff --git a/translations/messages.en.xlf b/translations/messages.en.xlf
index cfdd5305..c6509018 100644
--- a/translations/messages.en.xlf
+++ b/translations/messages.en.xlf
@@ -11157,6 +11157,18 @@ Please note, that you can not impersonate a disabled user. If you try you will g
         <target>History</target>
       </segment>
     </unit>
+    <unit id="spn_match_badge" name="info_providers.bulk_import.spn_match">
+      <segment state="translated">
+        <source>info_providers.bulk_import.spn_match</source>
+        <target>SPN matches</target>
+      </segment>
+    </unit>
+    <unit id="match_badge" name="info_providers.bulk_import.match">
+      <segment state="translated">
+        <source>info_providers.bulk_import.match</source>
+        <target>Match</target>
+      </segment>
+    </unit>
     <unit id="quick_apply_btn" name="info_providers.bulk_import.quick_apply">
       <segment state="translated">
         <source>info_providers.bulk_import.quick_apply</source>