Migrate revision inline js (#8263)

sonata-project · Feb 22, 2025 · c1042d6 · c1042d6
1 parent 418783e
commit c1042d6
Show file tree

Hide file tree

Showing 3 changed files with 40 additions and 38 deletions.
diff --git a/assets/js/controllers/revision_controller.js b/assets/js/controllers/revision_controller.js
@@ -0,0 +1,35 @@
+/*!
+ * This file is part of the Sonata Project package.
+ *
+ * (c) Thomas Rabaix <thomas.rabaix@sonata-project.org>
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+
+import { Controller } from '@hotwired/stimulus';
+
+export default class extends Controller {
+  static targets = ['preview'];
+
+  showPreview(event) {
+    const link = event.currentTarget;
+    if (!(link instanceof HTMLAnchorElement)) {
+      return;
+    }
+
+    const options = {
+      method: 'GET',
+      headers: {
+        'X-Requested-With': 'XMLHttpRequest',
+      },
+    };
+
+    this.previewTarget.innerHTML = '';
+    fetch(link.href, options)
+      .then((response) => response.text())
+      .then((response) => {
+        this.previewTarget.innerHTML = response;
+      });
+  }
+}
diff --git a/src/Resources/public/app.js b/src/Resources/public/app.js
diff --git a/src/Resources/views/CRUD/base_history.html.twig b/src/Resources/views/CRUD/base_history.html.twig
@@ -16,8 +16,7 @@ file that was distributed with this source code.
 {%- endblock -%}
 
 {% block content %}
-
-    <div class="row">
+    <div class="row" {{ stimulus_controller('sonata-revision') }}>
         <div class="col-md-5">
             <div class="box box-primary">
                 <div class="box-body table-responsive no-padding">
@@ -37,12 +36,12 @@ file that was distributed with this source code.
                                 <td>{{ revision.rev }}</td>
                                 <td>{% include get_admin_template('history_revision_timestamp', admin.code) %}</td>
                                 <td>{{ revision.username|default('label_unknown_user'|trans({}, 'SonataAdminBundle')) }}</td>
-                                <td><a href="{{ admin.generateObjectUrl('history_view_revision', object, {'revision': revision.rev }) }}" class="revision-link" rel="{{ revision.rev }}">{{ "label_view_revision"|trans({}, 'SonataAdminBundle') }}</a></td>
+                                <td><a href="{{ admin.generateObjectUrl('history_view_revision', object, {'revision': revision.rev }) }}"class="revision-link" rel="{{ revision.rev }}" {{ stimulus_action('sonata-revision', 'showPreview:prevent:stop', 'click') }}>{{ "label_view_revision"|trans({}, 'SonataAdminBundle') }}</a></td>
                                 <td>
                                     {% if (currentRevision == false or revision.rev == currentRevision.rev) %}
                                         /
                                     {% else %}
-                                        <a href="{{ admin.generateObjectUrl('history_compare_revisions', object, {'baseRevision': currentRevision.rev, 'compareRevision': revision.rev }) }}" class="revision-compare-link" rel="{{ revision.rev }}">{{ 'label_compare_revision'|trans({}, 'SonataAdminBundle') }}</a>
+                                        <a href="{{ admin.generateObjectUrl('history_compare_revisions', object, {'baseRevision': currentRevision.rev, 'compareRevision': revision.rev }) }}" class="revision-compare-link" rel="{{ revision.rev }}" {{ stimulus_action('sonata-revision', 'showPreview:prevent:stop', 'click') }}>{{ 'label_compare_revision'|trans({}, 'SonataAdminBundle') }}</a>
                                     {% endif %}
                                 </td>
                             </tr>
@@ -52,40 +51,8 @@ file that was distributed with this source code.
                 </div>
             </div>
         </div>
-        <div id="revision-detail" class="col-md-7 revision-detail">
+        <div id="revision-detail" class="col-md-7 revision-detail" {{ stimulus_target('sonata-revision', 'preview') }}>
 
         </div>
     </div>
-
-    <script>
-        jQuery(document).ready(function() {
-
-            jQuery('a.revision-link, a.revision-compare-link').bind('click', function(event) {
-                event.stopPropagation();
-                event.preventDefault();
-
-                action = jQuery(this).hasClass('revision-link')
-                    ? 'show'
-                    : 'compare';
-
-                jQuery('#revision-detail').html('');
-
-                if(action == 'show'){
-                    jQuery('table#revisions tbody tr').removeClass('current');
-                    jQuery(this).parent('').removeClass('current');
-                }
-
-                jQuery.ajax({
-                    url: jQuery(this).attr('href'),
-                    dataType: 'html',
-                    success: function(data) {
-                        jQuery('#revision-detail').html(data);
-                    }
-                });
-
-                return false;
-            });
-
-        });
-    </script>
 {% endblock %}