indicate more values (...) in filter dialog

Rello · Jan 20, 2025 · 974f7cf · 974f7cf
1 parent cb9851c
commit 974f7cf
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 1 deletion.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -3,6 +3,7 @@
 ### Fixed
 - dark mode issues
 - align border in filter dialog
+- indicate more values (...) in filter dialog
 
 ## 5.2.3 - 2025-01-14
 ### Added

diff --git a/css/style.css b/css/style.css
@@ -820,7 +820,7 @@ div.dt-container .dt-paging .dt-paging-button {
 
 .dropDownList {
     border-color: var(--color-primary-element) !important;
-    position: absolute;
+    /* position: absolute; hide so the full menu is being shown */
     z-index: 9999;
     background-color: var(--color-main-background);
     border-top: none !important;

diff --git a/js/app.js b/js/app.js
@@ -524,6 +524,12 @@ OCA.Analytics.UI = {
             listCount++;
         }
 
+        // show a dummy element when the list is longer
+        let liDummy = document.createElement('li');
+        liDummy.innerText = '...';
+        liDummy.id = 'dummy';
+        ul.appendChild(liDummy);
+
         // add the list to the input field and "open" its border at the bottom
         inputField.insertAdjacentElement('afterend', ul);
         inputField.classList.add('dropDownListParentOpen');
@@ -558,6 +564,10 @@ OCA.Analytics.UI = {
                     if (txtValue.toUpperCase().indexOf(filter) > -1 && listCount < listCountMax) {
                         li[i].style.display = "";
                         listCount++;
+                    } else if (li[i].id === 'dummy' && listCount >= listCountMax) {
+                        // always show the ... when there are more values available
+                        li[i].style.display = "";
+                        listCount++;
                     } else {
                         li[i].style.display = "none";
                     }