Use a BarItem for the notification pill

This commit is contained in:
2025-11-22 11:44:14 +01:00
parent 01a26fd910
commit 7e4b78d77b
+43 -40
View File
@@ -9,7 +9,7 @@ import qs.Services.System
import qs.Services.UI import qs.Services.UI
import qs.Widgets import qs.Widgets
NIconButton { Item {
id: root id: root
property ShellScreen screen property ShellScreen screen
@@ -33,6 +33,9 @@ NIconButton {
readonly property bool showUnreadBadge: (widgetSettings.showUnreadBadge !== undefined) ? widgetSettings.showUnreadBadge : widgetMetadata.showUnreadBadge readonly property bool showUnreadBadge: (widgetSettings.showUnreadBadge !== undefined) ? widgetSettings.showUnreadBadge : widgetMetadata.showUnreadBadge
readonly property bool hideWhenZero: (widgetSettings.hideWhenZero !== undefined) ? widgetSettings.hideWhenZero : widgetMetadata.hideWhenZero readonly property bool hideWhenZero: (widgetSettings.hideWhenZero !== undefined) ? widgetSettings.hideWhenZero : widgetMetadata.hideWhenZero
implicitWidth: pill.width
implicitHeight: pill.height
function computeUnreadCount() { function computeUnreadCount() {
var since = NotificationService.lastSeenTs; var since = NotificationService.lastSeenTs;
var count = 0; var count = 0;
@@ -46,17 +49,6 @@ NIconButton {
return count; return count;
} }
baseSize: Style.capsuleHeight
applyUiScale: false
density: Settings.data.bar.density
icon: NotificationService.doNotDisturb ? "bell-off" : "bell"
tooltipText: NotificationService.doNotDisturb ? I18n.tr("tooltips.open-notification-history-disable-dnd") : I18n.tr("tooltips.open-notification-history-enable-dnd")
tooltipDirection: BarService.getTooltipDirection()
colorBg: Style.capsuleColor
colorFg: Color.mOnSurface
colorBorder: Color.transparent
colorBorderHover: Color.transparent
NPopupContextMenu { NPopupContextMenu {
id: contextMenu id: contextMenu
@@ -94,37 +86,48 @@ NIconButton {
} }
} }
onClicked: { BarPill {
var panel = PanelService.getPanel("notificationHistoryPanel", screen); id: pill
panel?.toggle(this);
}
onRightClicked: { screen: root.screen
var popupMenuWindow = PanelService.getPopupMenuWindow(screen); density: Settings.data.bar.density
if (popupMenuWindow) { oppositeDirection: BarService.getPillDirection(root)
const pos = BarService.getContextMenuPosition(root, contextMenu.implicitWidth, contextMenu.implicitHeight); icon: NotificationService.doNotDisturb ? "bell-off" : "bell"
contextMenu.openAtItem(root, pos.x, pos.y); tooltipText: NotificationService.doNotDisturb ? I18n.tr("tooltips.open-notification-history-disable-dnd") : I18n.tr("tooltips.open-notification-history-enable-dnd")
popupMenuWindow.showContextMenu(contextMenu);
onClicked: {
var panel = PanelService.getPanel("notificationHistoryPanel", screen);
panel?.toggle(this);
} }
}
Loader { onRightClicked: {
anchors.right: parent.right var popupMenuWindow = PanelService.getPopupMenuWindow(screen);
anchors.top: parent.top if (popupMenuWindow) {
anchors.rightMargin: 2 const pos = BarService.getContextMenuPosition(root, contextMenu.implicitWidth, contextMenu.implicitHeight);
anchors.topMargin: 1 contextMenu.openAtItem(root, pos.x, pos.y);
z: 2 popupMenuWindow.showContextMenu(contextMenu);
active: showUnreadBadge && (!hideWhenZero || computeUnreadCount() > 0) }
sourceComponent: Rectangle { }
id: badge
readonly property int count: computeUnreadCount()
height: 8 Loader {
width: height anchors.right: parent.right
radius: height / 2 anchors.top: parent.top
color: Color.mError anchors.rightMargin: 2
border.color: Color.mSurface anchors.topMargin: 1
border.width: Style.borderS z: 2
visible: count > 0 || !hideWhenZero active: showUnreadBadge && (!hideWhenZero || computeUnreadCount() > 0)
sourceComponent: Rectangle {
id: badge
readonly property int count: computeUnreadCount()
height: 8
width: height
radius: height / 2
color: Color.mError
border.color: Color.mSurface
border.width: Style.borderS
visible: count > 0 || !hideWhenZero
}
} }
} }
} }