From 93a3e52c3435e40882f69835b599b509e0b275dc Mon Sep 17 00:00:00 2001
From: Jacob Rief <jacob.rief@gmail.com>
Date: Tue, 5 Mar 2024 16:30:28 +0100
Subject: [PATCH] fix #363: Better UX in versioning listview (#364)

Co-authored-by: Fabian Braun <fsbraun@gmx.de>
---
 djangocms_versioning/admin.py                 |  3 ++
 .../djangocms_versioning/js/versioning.js     | 37 +++++++++++++++++++
 2 files changed, 40 insertions(+)
 create mode 100644 djangocms_versioning/static/djangocms_versioning/js/versioning.js

diff --git a/djangocms_versioning/admin.py b/djangocms_versioning/admin.py
index 16008576..bc73d4dc 100644
--- a/djangocms_versioning/admin.py
+++ b/djangocms_versioning/admin.py
@@ -608,6 +608,9 @@ class VersionAdmin(ChangeListActionsMixin, admin.ModelAdmin, metaclass=MediaDefi
     # def get_queryset(self, request):
     #     return super().get_queryset(request).prefetch_related('content')
 
+    class Media:
+        js = ["djangocms_versioning/js/versioning.js"]
+
     def get_changelist(self, request, **kwargs):
         return VersionChangeList
 
diff --git a/djangocms_versioning/static/djangocms_versioning/js/versioning.js b/djangocms_versioning/static/djangocms_versioning/js/versioning.js
new file mode 100644
index 00000000..0704f537
--- /dev/null
+++ b/djangocms_versioning/static/djangocms_versioning/js/versioning.js
@@ -0,0 +1,37 @@
+(function() {
+    var firstChecked, lastChecked;
+
+    function handleVersionSelection(event) {
+        if (firstChecked instanceof HTMLInputElement && firstChecked.checked) {
+            firstChecked.checked = false;
+            firstChecked.closest('tr').classList.remove('selected');
+            firstChecked = lastChecked;
+        }
+        if (event.target instanceof HTMLInputElement) {
+            if (event.target.checked) {
+                firstChecked = lastChecked;
+                lastChecked = event.target;
+            } else if (firstChecked === event.target) {
+                firstChecked = null;
+            } else {
+                lastChecked = null;
+            }
+        }
+    }
+
+    document.addEventListener('DOMContentLoaded', function(){
+        var selectedVersions = document.querySelectorAll('#result_list input[type="checkbox"].action-select');
+        var selectElement = document.querySelector('#changelist-form select[name="action"]');
+        if (selectElement instanceof HTMLSelectElement) {
+            for (var i = 0; i < selectElement.options.length; i++) {
+                if (selectElement.options[i].value && selectElement.options[i].value !== 'compare_versions') {
+                    // for future safety: do not restrict on two selected versions, since there might be other actions
+                    return;
+                }
+            }
+        }
+        selectedVersions.forEach(function(selectedVersion){
+            selectedVersion.addEventListener('change', handleVersionSelection);
+        });
+    });
+ })();