feat(clipboard): add type filters to clipboard history (#2640)

* feat(clipboard): add active filter state

* feat(clipboard): add clipboard filtering logic

* feat(clipboard): wire clipboard filter state to UI

* feat(clipboard): add filter dropdown

* feat(clipboard): move filter dropdown beside search

* refactor(clipboard): update filter defaults

---------

Co-authored-by: purian23 <purian23@gmail.com>

quickshell/Modals/Clipboard/ClipboardContent.qml

@@ -11,6 +11,14 @@ Item {
     property alias searchField: searchField
     property alias clipboardListView: clipboardListView
 
+    readonly property var filterOptions: [I18n.tr("All"), I18n.tr("Text"), I18n.tr("Long Text"), I18n.tr("Image")]
+    readonly property var filterValues: ["all", "text", "long_text", "image"]
+
+    function closeFilterMenu() {
+        filterMenuLoader.active = false;
+        filterMenuLoader.active = true;
+    }
+
     anchors.fill: parent
 
     Column {
@@ -36,27 +44,81 @@ Item {
             onCloseClicked: modal.hide()
         }
 
-        DankTextField {
-            id: searchField
+        Item {
+            id: searchRow
             width: parent.width
-            placeholderText: ""
-            leftIconName: "search"
-            showClearButton: true
-            focus: true
-            ignoreTabKeys: true
-            keyForwardTargets: [modal.modalFocusScope]
-            onTextChanged: {
-                modal.searchText = text;
-                modal.updateFilteredModel();
+            implicitHeight: searchField.height
+
+            DankTextField {
+                id: searchField
+
+                width: parent.width
+                rightAccessoryWidth: filterButton.width + Theme.spacingS
+                placeholderText: ""
+                leftIconName: "search"
+                showClearButton: true
+                focus: true
+                ignoreTabKeys: true
+                keyForwardTargets: [modal.modalFocusScope]
+
+                onTextChanged: {
+                    modal.searchText = text;
+                    modal.updateFilteredModel();
+                }
+
+                Keys.onEscapePressed: function (event) {
+                    modal.hide();
+                    event.accepted = true;
+                }
+
+                Component.onCompleted: {
+                    Qt.callLater(function () {
+                        forceActiveFocus();
+                    });
+                }
             }
-            Keys.onEscapePressed: function (event) {
-                modal.hide();
-                event.accepted = true;
+
+            DankActionButton {
+                id: filterButton
+
+                anchors.right: parent.right
+                anchors.rightMargin: Theme.spacingS
+                anchors.verticalCenter: parent.verticalCenter
+                iconName: "filter_list"
+                iconColor: modal.activeFilter !== "all" ? Theme.primary : Theme.surfaceText
+                backgroundColor: modal.activeFilter !== "all" ? Theme.primarySelected : "transparent"
+                tooltipText: I18n.tr("Filter by type", "Clipboard history type filter button tooltip")
+                onClicked: filterMenuLoader.item?.openDropdownMenu()
             }
-            Component.onCompleted: {
-                Qt.callLater(function () {
-                    forceActiveFocus();
-                });
+
+            Loader {
+                id: filterMenuLoader
+
+                active: true
+                sourceComponent: filterMenuComponent
+            }
+
+            Component {
+                id: filterMenuComponent
+
+                DankDropdown {
+                    showTrigger: false
+                    popupAnchorItem: filterButton
+                    popupWidth: 180
+                    alignPopupRight: true
+                    options: clipboardContent.filterOptions
+                    currentValue: {
+                        const idx = clipboardContent.filterValues.indexOf(clipboardContent.modal.activeFilter);
+                        return idx >= 0 ? clipboardContent.filterOptions[idx] : clipboardContent.filterOptions[0];
+                    }
+
+                    onValueChanged: value => {
+                        const idx = clipboardContent.filterOptions.indexOf(value);
+                        if (idx >= 0) {
+                            clipboardContent.modal.activeFilter = clipboardContent.filterValues[idx];
+                        }
+                    }
+                }
             }
         }
     }

quickshell/Modals/Clipboard/ClipboardHeader.qml

@@ -38,6 +38,7 @@ Item {
             font.weight: Font.Medium
             anchors.verticalCenter: parent.verticalCenter
         }
+
     }
 
     Row {

quickshell/Modals/Clipboard/ClipboardHistoryContent.qml

@@ -16,6 +16,7 @@ FocusScope {
 
     property string mode: "history"
     property string searchText: ClipboardService.searchText
+    property string activeFilter: SettingsData.clipboardRememberTypeFilter ? SettingsData.clipboardTypeFilter : "all"
 
     readonly property bool clipboardAvailable: ClipboardService.clipboardAvailable
     readonly property bool wtypeAvailable: ClipboardService.wtypeAvailable
@@ -50,6 +51,16 @@ FocusScope {
     }
     onSearchTextChanged: ClipboardService.searchText = searchText
 
+    onActiveFilterChanged: {
+        ClipboardService.activeFilter = activeFilter;
+        ClipboardService.selectedIndex = 0;
+        ClipboardService.keyboardNavigationActive = false;
+        ClipboardService.updateFilteredModel();
+        if (SettingsData.clipboardRememberTypeFilter) {
+            SettingsData.set("clipboardTypeFilter", activeFilter);
+        }
+    }
+
     function hide() {
         closeRequested();
     }
@@ -118,6 +129,8 @@ FocusScope {
     function resetState() {
         activeImageLoads = 0;
         mode = "history";
+        historyContent.closeFilterMenu();
+        activeFilter = SettingsData.clipboardRememberTypeFilter ? SettingsData.clipboardTypeFilter : "all";
         ClipboardService.reset();
         keyboardController.reset();
     }