diff --git a/Modules/Bar/NotificationHistory.qml b/Modules/Bar/NotificationHistory.qml index e1dbc3b..ba794b4 100644 --- a/Modules/Bar/NotificationHistory.qml +++ b/Modules/Bar/NotificationHistory.qml @@ -20,21 +20,6 @@ NIconButton { colorBorderHover: Color.transparent onClicked: { - if (!notificationHistoryPanel.active) { - 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 - } - } + notificationHistoryPanel.toggle(screen) } } diff --git a/Modules/Notification/NotificationHistoryPanel.qml b/Modules/Notification/NotificationHistoryPanel.qml index a52950e..affcad1 100644 --- a/Modules/Notification/NotificationHistoryPanel.qml +++ b/Modules/Notification/NotificationHistoryPanel.qml @@ -8,267 +8,191 @@ import qs.Commons import qs.Services import qs.Widgets -// Loader for Notification History panel -NLoader { +// Notification History panel +NPanel { id: root - content: Component { - NPanel { - id: notificationPanel + rWidth: 400 * scaling + rHeight: 500 * scaling + rAnchorRight: true - // Override hide function to animate first - function hide() { - // Start hide animation - notificationRect.scaleValue = 0.8 - notificationRect.opacityValue = 0.0 + panelContent: Rectangle { + id: notificationRect + color: Color.transparent - // Hide after animation completes - hideTimer.start() - } + // color: Color.mSurface + // radius: Style.radiusL * scaling + // border.color: Color.mOutline + // border.width: Math.max(1, Style.borderS * scaling) - Connections { - target: notificationPanel - ignoreUnknownSignals: true - function onDismissed() { - // Start hide animation - notificationRect.scaleValue = 0.8 - notificationRect.opacityValue = 0.0 + // anchors.top: parent.top + // anchors.right: parent.right + // anchors.topMargin: Style.marginXS * scaling + // anchors.rightMargin: Style.marginXS * scaling + // clip: true + ColumnLayout { + anchors.fill: parent + anchors.margins: Style.marginL * scaling + spacing: Style.marginM * scaling - // Hide after animation completes - hideTimer.start() - } - } + RowLayout { + Layout.fillWidth: true + spacing: Style.marginM * scaling - // Also handle visibility changes from external sources - onVisibleChanged: { - if (!visible && notificationRect.opacityValue > 0) { - // Start hide animation - 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 + NIcon { + text: "notifications" + font.pointSize: Style.fontSizeXXL * scaling + color: Color.mPrimary } - // Animation behaviors - Behavior on scale { - NumberAnimation { - duration: Style.animationSlow - easing.type: Easing.OutExpo + NText { + text: "Notification History" + font.pointSize: Style.fontSizeL * scaling + font.bold: true + 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 { - NumberAnimation { - duration: Style.animationNormal - easing.type: Easing.OutQuad - } - } + NDivider { + Layout.fillWidth: true + } + + // Empty state when no notifications + Item { + Layout.fillWidth: true + Layout.fillHeight: true + visible: NotificationService.historyModel.count === 0 ColumnLayout { - anchors.fill: parent - anchors.margins: Style.marginL * scaling + 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 { + 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 { - text: "notifications" - font.pointSize: Style.fontSizeXXL * scaling - color: Color.mPrimary - } - - NText { - text: "Notification History" - font.pointSize: Style.fontSizeL * scaling - font.bold: true - color: Color.mOnSurface + // 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: "Clear History" - sizeMultiplier: 0.8 - onClicked: NotificationService.clearHistory() - } + tooltipText: "Delete Notification" + sizeMultiplier: 0.7 - NIconButton { - icon: "close" - tooltipText: "Close" - sizeMultiplier: 0.8 onClicked: { - notificationPanel.hide() + Logger.log("NotificationHistory", "Removing notification:", summary) + NotificationService.historyModel.remove(index) + NotificationService.saveHistory() } } } - NDivider {} - - // Empty state when no notifications - Item { - Layout.fillWidth: true - Layout.fillHeight: true - 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 - } - } + 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 } + } - 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 { - 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 - } - } + ScrollBar.vertical: ScrollBar { + active: true + anchors.right: parent.right + anchors.top: parent.top + anchors.bottom: parent.bottom } } } diff --git a/Modules/SidePanel/SidePanel.qml b/Modules/SidePanel/SidePanel.qml index 58b3065..6380a72 100644 --- a/Modules/SidePanel/SidePanel.qml +++ b/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