NotificationHistory panel

Modules/Bar/NotificationHistory.qml

@@ -20,21 +20,6 @@ NIconButton {
   colorBorderHover: Color.transparent
 
   onClicked: {
-    if (!notificationHistoryPanel.active) {
+    notificationHistoryPanel.toggle(screen)
-      notificationHistoryPanel.isLoaded = true
-    }
-    if (notificationHistoryPanel.item) {
-      if (notificationHistoryPanel.item.visible) {
-        // Panel is visible, hide it with animation
-        if (notificationHistoryPanel.item.hide) {
-          notificationHistoryPanel.item.hide()
-        } else {
-          notificationHistoryPanel.item.visible = false
-        }
-      } else {
-        // Panel is hidden, show it
-        notificationHistoryPanel.item.visible = true
-      }
-    }
   }
 }

Modules/Notification/NotificationHistoryPanel.qml

@@ -8,267 +8,191 @@ import qs.Commons
 import qs.Services
 import qs.Widgets
 
-// Loader for Notification History panel
+// Notification History panel
-NLoader {
+NPanel {
   id: root
 
-  content: Component {
+  rWidth: 400 * scaling
-    NPanel {
+  rHeight: 500 * scaling
-      id: notificationPanel
+  rAnchorRight: true
 
-      // Override hide function to animate first
+  panelContent: Rectangle {
-      function hide() {
+    id: notificationRect
-        // Start hide animation
+    color: Color.transparent
-        notificationRect.scaleValue = 0.8
-        notificationRect.opacityValue = 0.0
 
-        // Hide after animation completes
+    // color: Color.mSurface
-        hideTimer.start()
+    // radius: Style.radiusL * scaling
-      }
+    // border.color: Color.mOutline
+    // border.width: Math.max(1, Style.borderS * scaling)
 
-      Connections {
+    // anchors.top: parent.top
-        target: notificationPanel
+    // anchors.right: parent.right
-        ignoreUnknownSignals: true
+    // anchors.topMargin: Style.marginXS * scaling
-        function onDismissed() {
+    // anchors.rightMargin: Style.marginXS * scaling
-          // Start hide animation
+    // clip: true
-          notificationRect.scaleValue = 0.8
+    ColumnLayout {
-          notificationRect.opacityValue = 0.0
+      anchors.fill: parent
+      anchors.margins: Style.marginL * scaling
+      spacing: Style.marginM * scaling
 
-          // Hide after animation completes
+      RowLayout {
-          hideTimer.start()
+        Layout.fillWidth: true
-        }
+        spacing: Style.marginM * scaling
-      }
 
-      // Also handle visibility changes from external sources
+        NIcon {
-      onVisibleChanged: {
+          text: "notifications"
-        if (!visible && notificationRect.opacityValue > 0) {
+          font.pointSize: Style.fontSizeXXL * scaling
-          // Start hide animation
+          color: Color.mPrimary
-          notificationRect.scaleValue = 0.8
-          notificationRect.opacityValue = 0.0
-
-          // Hide after animation completes
-          hideTimer.start()
-        }
-      }
-
-      // Timer to hide panel after animation
-      Timer {
-        id: hideTimer
-        interval: Style.animationSlow
-        repeat: false
-        onTriggered: {
-          notificationPanel.visible = false
-          notificationPanel.dismissed()
-        }
-      }
-
-      WlrLayershell.keyboardFocus: WlrKeyboardFocus.OnDemand
-
-      Rectangle {
-        id: notificationRect
-        color: Color.mSurface
-        radius: Style.radiusL * scaling
-        border.color: Color.mOutline
-        border.width: Math.max(1, Style.borderS * scaling)
-        width: 400 * scaling
-        height: 500 * scaling
-        anchors.top: parent.top
-        anchors.right: parent.right
-        anchors.topMargin: Style.marginXS * scaling
-        anchors.rightMargin: Style.marginXS * scaling
-        clip: true
-
-        // Animation properties
-        property real scaleValue: 0.8
-        property real opacityValue: 0.0
-
-        scale: scaleValue
-        opacity: opacityValue
-
-        // Animate in when component is completed
-        Component.onCompleted: {
-          scaleValue = 1.0
-          opacityValue = 1.0
         }
 
-        // Animation behaviors
+        NText {
-        Behavior on scale {
+          text: "Notification History"
-          NumberAnimation {
+          font.pointSize: Style.fontSizeL * scaling
-            duration: Style.animationSlow
+          font.bold: true
-            easing.type: Easing.OutExpo
+          color: Color.mOnSurface
+          Layout.fillWidth: true
+        }
+
+        NIconButton {
+          icon: "delete"
+          tooltipText: "Clear History"
+          sizeMultiplier: 0.8
+          onClicked: NotificationService.clearHistory()
+        }
+
+        NIconButton {
+          icon: "close"
+          tooltipText: "Close"
+          sizeMultiplier: 0.8
+          onClicked: {
+            root.close()
           }
         }
+      }
 
-        Behavior on opacity {
+      NDivider {
-          NumberAnimation {
+        Layout.fillWidth: true
-            duration: Style.animationNormal
+      }
-            easing.type: Easing.OutQuad
+
-          }
+      // Empty state when no notifications
-        }
+      Item {
+        Layout.fillWidth: true
+        Layout.fillHeight: true
+        visible: NotificationService.historyModel.count === 0
 
         ColumnLayout {
-          anchors.fill: parent
+          anchors.centerIn: parent
-          anchors.margins: Style.marginL * scaling
           spacing: Style.marginM * scaling
 
+          NIcon {
+            text: "notifications_off"
+            font.pointSize: Style.fontSizeXXXL * scaling
+            color: Color.mOnSurfaceVariant
+            Layout.alignment: Qt.AlignHCenter
+          }
+
+          NText {
+            text: "No notifications"
+            font.pointSize: Style.fontSizeL * scaling
+            color: Color.mOnSurfaceVariant
+            Layout.alignment: Qt.AlignHCenter
+          }
+
+          NText {
+            text: "Notifications will appear here when you receive them"
+            font.pointSize: Style.fontSizeNormal * scaling
+            color: Color.mOnSurfaceVariant
+            Layout.alignment: Qt.AlignHCenter
+          }
+        }
+      }
+
+      ListView {
+        id: notificationList
+        Layout.fillWidth: true
+        Layout.fillHeight: true
+        model: NotificationService.historyModel
+        spacing: Style.marginM * scaling
+        clip: true
+        boundsBehavior: Flickable.StopAtBounds
+        visible: NotificationService.historyModel.count > 0
+
+        delegate: Rectangle {
+          width: notificationList ? (notificationList.width - 20) : 380 * scaling
+          height: Math.max(80, notificationContent.height + 30)
+          radius: Style.radiusM * scaling
+          color: notificationMouseArea.containsMouse ? Color.mPrimary : Color.mSurfaceVariant
+
           RowLayout {
-            Layout.fillWidth: true
+            anchors {
+              fill: parent
+              margins: Style.marginM * scaling
+            }
             spacing: Style.marginM * scaling
 
-            NIcon {
+            // Notification content
-              text: "notifications"
+            Column {
-              font.pointSize: Style.fontSizeXXL * scaling
+              id: notificationContent
-              color: Color.mPrimary
-            }
-
-            NText {
-              text: "Notification History"
-              font.pointSize: Style.fontSizeL * scaling
-              font.bold: true
-              color: Color.mOnSurface
               Layout.fillWidth: true
+              Layout.alignment: Qt.AlignVCenter
+              spacing: Style.marginXXS * scaling
+
+              NText {
+                text: (summary || "No summary").substring(0, 100)
+                font.pointSize: Style.fontSizeM * scaling
+                font.weight: Font.Medium
+                color: notificationMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface
+                wrapMode: Text.Wrap
+                width: parent.width - 60
+                maximumLineCount: 2
+                elide: Text.ElideRight
+              }
+
+              NText {
+                text: (body || "").substring(0, 150)
+                font.pointSize: Style.fontSizeXS * scaling
+                color: notificationMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface
+                wrapMode: Text.Wrap
+                width: parent.width - 60
+                maximumLineCount: 3
+                elide: Text.ElideRight
+              }
+
+              NText {
+                text: NotificationService.formatTimestamp(timestamp)
+                font.pointSize: Style.fontSizeXS * scaling
+                color: notificationMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface
+              }
             }
 
+            // Trash icon button
             NIconButton {
               icon: "delete"
-              tooltipText: "Clear History"
+              tooltipText: "Delete Notification"
-              sizeMultiplier: 0.8
+              sizeMultiplier: 0.7
-              onClicked: NotificationService.clearHistory()
-            }
 
-            NIconButton {
-              icon: "close"
-              tooltipText: "Close"
-              sizeMultiplier: 0.8
               onClicked: {
-                notificationPanel.hide()
+                Logger.log("NotificationHistory", "Removing notification:", summary)
+                NotificationService.historyModel.remove(index)
+                NotificationService.saveHistory()
               }
             }
           }
 
-          NDivider {}
+          MouseArea {
-
+            id: notificationMouseArea
-          // Empty state when no notifications
+            anchors.fill: parent
-          Item {
+            anchors.rightMargin: Style.marginL * 3 * scaling
-            Layout.fillWidth: true
+            hoverEnabled: true
-            Layout.fillHeight: true
+            // Remove the onClicked handler since we now have a dedicated delete button
-            visible: NotificationService.historyModel.count === 0
-
-            ColumnLayout {
-              anchors.centerIn: parent
-              spacing: Style.marginM * scaling
-
-              NIcon {
-                text: "notifications_off"
-                font.pointSize: Style.fontSizeXXXL * scaling
-                color: Color.mOnSurfaceVariant
-                Layout.alignment: Qt.AlignHCenter
-              }
-
-              NText {
-                text: "No notifications"
-                font.pointSize: Style.fontSizeL * scaling
-                color: Color.mOnSurfaceVariant
-                Layout.alignment: Qt.AlignHCenter
-              }
-
-              NText {
-                text: "Notifications will appear here when you receive them"
-                font.pointSize: Style.fontSizeNormal * scaling
-                color: Color.mOnSurfaceVariant
-                Layout.alignment: Qt.AlignHCenter
-              }
-            }
           }
+        }
 
-          ListView {
+        ScrollBar.vertical: ScrollBar {
-            id: notificationList
+          active: true
-            Layout.fillWidth: true
+          anchors.right: parent.right
-            Layout.fillHeight: true
+          anchors.top: parent.top
-            model: NotificationService.historyModel
+          anchors.bottom: parent.bottom
-            spacing: Style.marginM * scaling
-            clip: true
-            boundsBehavior: Flickable.StopAtBounds
-            visible: NotificationService.historyModel.count > 0
-
-            delegate: Rectangle {
-              width: notificationList ? (notificationList.width - 20) : 380 * scaling
-              height: Math.max(80, notificationContent.height + 30)
-              radius: Style.radiusM * scaling
-              color: notificationMouseArea.containsMouse ? Color.mPrimary : Color.mSurfaceVariant
-
-              RowLayout {
-                anchors {
-                  fill: parent
-                  margins: Style.marginM * scaling
-                }
-                spacing: Style.marginM * scaling
-
-                // Notification content
-                Column {
-                  id: notificationContent
-                  Layout.fillWidth: true
-                  Layout.alignment: Qt.AlignVCenter
-                  spacing: Style.marginXXS * scaling
-
-                  NText {
-                    text: (summary || "No summary").substring(0, 100)
-                    font.pointSize: Style.fontSizeM * scaling
-                    font.weight: Font.Medium
-                    color: notificationMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface
-                    wrapMode: Text.Wrap
-                    width: parent.width - 60
-                    maximumLineCount: 2
-                    elide: Text.ElideRight
-                  }
-
-                  NText {
-                    text: (body || "").substring(0, 150)
-                    font.pointSize: Style.fontSizeXS * scaling
-                    color: notificationMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface
-                    wrapMode: Text.Wrap
-                    width: parent.width - 60
-                    maximumLineCount: 3
-                    elide: Text.ElideRight
-                  }
-
-                  NText {
-                    text: NotificationService.formatTimestamp(timestamp)
-                    font.pointSize: Style.fontSizeXS * scaling
-                    color: notificationMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface
-                  }
-                }
-
-                // Trash icon button
-                NIconButton {
-                  icon: "delete"
-                  tooltipText: "Delete Notification"
-                  sizeMultiplier: 0.7
-
-                  onClicked: {
-                    Logger.log("NotificationHistory", "Removing notification:", summary)
-                    NotificationService.historyModel.remove(index)
-                    NotificationService.saveHistory()
-                  }
-                }
-              }
-
-              MouseArea {
-                id: notificationMouseArea
-                anchors.fill: parent
-                anchors.rightMargin: Style.marginL * 3 * scaling
-                hoverEnabled: true
-                // Remove the onClicked handler since we now have a dedicated delete button
-              }
-            }
-
-            ScrollBar.vertical: ScrollBar {
-              active: true
-              anchors.right: parent.right
-              anchors.top: parent.top
-              anchors.bottom: parent.bottom
-            }
-          }
         }
       }
     }

Modules/SidePanel/SidePanel.qml

@@ -14,9 +14,6 @@ NPanel {
   rHeight: 700 * scaling
   rAnchorRight: true
 
-  // rectX: Math.max(Style.marginS * scaling, Math.min(parent.width - width - Style.marginS * scaling,
-  //                                                   Math.round(anchorX - width / 2)))
-  // rectY: Settings.data.bar.position === "top" ? Style.marginS * scaling : undefined
   panelContent: Item {
     id: content