sidebar/notifs: add mouse actions

modules/sidebar/NotifDock.qml

@@ -95,11 +95,68 @@ Item {
             clip: true
 
             model: ScriptModel {
-                values: [...new Set(Notifs.list.map(notif => notif.appName))].reverse()
+                values: [...new Set(Notifs.list.filter(n => !n.closed).map(n => n.appName))].reverse()
             }
 
-            delegate: NotifGroup {
+            delegate: MouseArea {
-                props: root.props
+                id: notif
+
+                required property int index
+                required property string modelData
+
+                property int startY
+
+                function closeAll(): void {
+                    for (const n of Notifs.list.filter(n => !n.closed && n.appName === modelData))
+                        n.close();
+                }
+
+                implicitWidth: root.width
+                implicitHeight: notifInner.implicitHeight
+
+                hoverEnabled: true
+                cursorShape: pressed ? Qt.ClosedHandCursor : undefined
+                acceptedButtons: Qt.LeftButton | Qt.RightButton | Qt.MiddleButton
+                preventStealing: true
+
+                drag.target: this
+                drag.axis: Drag.XAxis
+
+                onPressed: event => {
+                    if (event.button === Qt.LeftButton)
+                        startY = event.y;
+                    else if (event.button === Qt.RightButton)
+                        notifInner.toggleExpand();
+                    else if (event.button === Qt.MiddleButton)
+                        closeAll();
+                }
+                onPositionChanged: event => {
+                    if (pressed) {
+                        const diffY = event.y - startY;
+                        if (Math.abs(diffY) > Config.notifs.expandThreshold)
+                            notifInner.toggleExpand(diffY > 0);
+                    }
+                }
+                onReleased: event => {
+                    if (Math.abs(x) < width * Config.notifs.clearThreshold)
+                        x = 0;
+                    else
+                        closeAll();
+                }
+
+                NotifGroup {
+                    id: notifInner
+
+                    modelData: notif.modelData
+                    props: root.props
+                }
+
+                Behavior on x {
+                    Anim {
+                        duration: Appearance.anim.durations.expressiveDefaultSpatial
+                        easing.bezierCurve: Appearance.anim.curves.expressiveDefaultSpatial
+                    }
+                }
             }
 
             add: Transition {

modules/sidebar/NotifGroup.qml

@@ -24,6 +24,15 @@ StyledRect {
 
     readonly property bool expanded: props.expandedNotifs.includes(modelData)
 
+    function toggleExpand(expand: bool): void {
+        if (expand) {
+            if (!expanded)
+                props.expandedNotifs.push(modelData);
+        } else if (expanded) {
+            props.expandedNotifs.splice(props.expandedNotifs.indexOf(modelData), 1);
+        }
+    }
+
     anchors.left: parent?.left
     anchors.right: parent?.right
     implicitHeight: content.implicitHeight + Appearance.padding.normal * 2
@@ -156,10 +165,7 @@ StyledRect {
                         color: root.urgency === "critical" ? Colours.palette.m3onError : Colours.palette.m3onSurface
 
                         function onClicked(): void {
-                            if (root.expanded)
+                            root.toggleExpand(!root.expanded);
-                                root.props.expandedNotifs.splice(root.props.expandedNotifs.indexOf(root.modelData), 1);
-                            else
-                                root.props.expandedNotifs.push(root.modelData);
                         }
                     }
 
@@ -197,6 +203,7 @@ StyledRect {
                 props: root.props
                 notifs: root.notifs
                 expanded: root.expanded
+                onRequestToggleExpand: expand => root.toggleExpand(expand)
             }
         }
     }

modules/sidebar/NotifGroupList.qml

@@ -17,6 +17,8 @@ Item {
     readonly property int spacing: Math.round(Appearance.spacing.small / 2)
     property bool flag
 
+    signal requestToggleExpand(expand: bool)
+
     Layout.fillWidth: true
     implicitHeight: {
         const item = repeater.itemAt(repeater.count - 1);
@@ -56,16 +58,26 @@ Item {
 
             hoverEnabled: true
             cursorShape: pressed ? Qt.ClosedHandCursor : undefined
-            acceptedButtons: Qt.LeftButton | Qt.MiddleButton
+            acceptedButtons: Qt.LeftButton | Qt.RightButton | Qt.MiddleButton
+            preventStealing: true
 
             drag.target: this
             drag.axis: Drag.XAxis
 
             onPressed: event => {
                 startY = event.y;
-                if (event.button === Qt.MiddleButton)
+                if (event.button === Qt.RightButton)
+                    root.requestToggleExpand(!root.expanded);
+                else if (event.button === Qt.MiddleButton)
                     modelData.close();
             }
+            onPositionChanged: event => {
+                if (pressed) {
+                    const diffY = event.y - startY;
+                    if (Math.abs(diffY) > Config.notifs.expandThreshold)
+                        root.requestToggleExpand(diffY > 0);
+                }
+            }
             onReleased: event => {
                 if (Math.abs(x) < width * Config.notifs.clearThreshold)
                     x = 0;