bug #6622 Fix the handling of the icon using JavaScript in the slug f…

…ield (javiereguiluz) This PR was squashed before being merged into the 4.x branch. Discussion ---------- Fix the handling of the icon using JavaScript in the slug field Fixes #6537 (comment) #SymfonyHackday Commits ------- a2819f4 Fix the handling of the icon using JavaScript in the slug field
EasyCorp · Dec 7, 2024 · cb9cc4e · cb9cc4e
2 parents 2574584 + a2819f4
commit cb9cc4e
Show file tree

Hide file tree

Showing 6 changed files with 9 additions and 7 deletions.
diff --git a/assets/icons/internal/lock-open-solid.svg b/assets/icons/internal/lock-open-solid.svg
diff --git a/assets/js/field-slug.js b/assets/js/field-slug.js
@@ -83,7 +83,6 @@ class Slugger {
      */
     appendLockButton() {
         this.lockButton = this.field.parentNode.querySelector('button');
-        this.lockButtonIcon = this.lockButton.querySelector('i');
         this.lockButton.addEventListener('click', () => {
             if (this.locked) {
                 let confirmMessage = this.field.dataset.confirmText || null;
@@ -106,7 +105,7 @@ class Slugger {
      */
     unlock() {
         this.locked = false;
-        this.lockButtonIcon.classList.replace('fa-lock', 'fa-lock-open');
+        this.lockButton.innerHTML = this.lockButton.getAttribute('data-icon-unlocked');
         this.field.removeAttribute('readonly');
     }
 
@@ -115,7 +114,7 @@ class Slugger {
      */
     lock() {
         this.locked = true;
-        this.lockButtonIcon.classList.replace('fa-lock-open', 'fa-lock');
+        this.lockButton.innerHTML = this.lockButton.getAttribute('data-icon-locked');
 
         // Locking it back changes the value either to default value, or recomputes it
         if ('' !== this.currentSlug) {

diff --git a/public/entrypoints.json b/public/entrypoints.json
@@ -53,7 +53,7 @@
     },
     "field-slug": {
       "js": [
-        "/field-slug.bed171ad.js"
+        "/field-slug.df11f109.js"
       ]
     },
     "field-textarea": {

diff --git a/public/field-slug.bed171ad.js → public/field-slug.df11f109.js b/public/field-slug.bed171ad.js → public/field-slug.df11f109.js
diff --git a/public/manifest.json b/public/manifest.json
@@ -10,7 +10,7 @@
   "field-collection.js": "field-collection.f685c209.js",
   "field-file-upload.js": "field-file-upload.7f9cb952.js",
   "field-image.js": "field-image.c338d2ad.js",
-  "field-slug.js": "field-slug.bed171ad.js",
+  "field-slug.js": "field-slug.df11f109.js",
   "field-textarea.js": "field-textarea.74319bb1.js",
   "field-text-editor.css": "field-text-editor.750725ec.css",
   "field-text-editor.js": "field-text-editor.cb6de4f5.js",

diff --git a/templates/crud/form_theme.html.twig b/templates/crud/form_theme.html.twig
@@ -872,7 +872,9 @@
 
     <div class="input-group">
         {{ block('form_widget') }}
-        <button type="button" class="btn">
+        <button type="button" class="btn"
+                data-icon-locked="{{ component('ea:Icon', {name: 'internal:lock'})|e('html_attr') }}"
+                data-icon-unlocked="{{ component('ea:Icon', {name: 'internal:lock-open-solid'})|e('html_attr') }}">
             <twig:ea:Icon name="internal:lock" />
         </button>
     </div>